The Code does not function of sample example

browser
cypher

(Sucheta) #1

Hi,
I tried the code mentioned in the link -

I altered the values suiting my data.

  <!doctype html>
  <meta charset="utf-8"/>
   <html>
          <head>
                    <title>Neovis.js Simple Example</title>
                     <style type="text/css">
                   html, body {
                     font: 16pt arial;
                       }
                       #viz {
                              width: 900px;
                             height: 700px;
                             border: 10px solid #456789;
                              font: 22pt arial;
                             }
                        </style>

                  <!-- FIXME: load from dist -->
                 <script type="text/javascript" src="https://rawgit.com/neo4j-contrib/neovis.js/master   
                   /dist/neovis.js"></script>


              <script
           src="https://code.jquery.com/jquery-3.2.1.min.js"
           integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
            crossorigin="anonymous"></script>

             <script type="text/javascript">
               // define config car
              // instantiate nodevis object
              // draw
             var viz;
             function draw() {
                 var config = {
                       container_id: "viz",
                       server_url: "bolt://54.167.174.205:34866",
                       server_user: "neo4j",
                        server_password: "copper-sample-armful",
                       labels: {
                       //"Character": "name",
                      "API": {
                          "caption": "name",
                          "size": "pagerank",
                           "community": "community"
                             //"sizeCypher": "MATCH (n) WHERE id(n) = {id} MATCH (n)-[r]-() RETURN 
                           sum(r.weight) AS c"
                     }
                  },
                  relationships: {
                      "corebanking": {
                      "thickness": "weight",
                       "caption": false
                        }
                 },
                  initial_cypher: "MATCH (n:API) RETURN n LIMIT 25"
               };
              viz = new NeoVis.default(config);
              viz.render();
                console.log(viz);
               }
         </script>
      </head>
       <body onload="draw()">
        <div id="viz"></div>


         Cypher query: <textarea rows="4" cols=50 id="cypher"></textarea><br>
         <input type="submit" value="Submit" id="reload">
          <input type="submit" value="Stabilize" id="stabilize">


        </body>

       <script>
       document.getElementById("viz").style.border = "thick solid #456789";
       $("#reload").click(function() {
        var cypher = $("#cypher").val();
         if (cypher.length > 3) {
         viz.renderWithCypher(cypher);
              } else {
          console.log("reload");
           viz.reload();
               }
            });
         $("#stabilize").click(function() {
          viz.stabilize();
           })
       </script>

I get the output of the Primary nodes. But what is the function of the below mentioned code in script - viz.renderWithCypher(cypher); ?

     <script>
          $("#reload").click(function() {
            var cypher = $("#cypher").val();
            if (cypher.length > 3) {
            viz.renderWithCypher(cypher);
             } else {
            console.log("reload");
            viz.reload();
            }
        });
       $("#stabilize").click(function() {
        viz.stabilize();
          })
    </script>

Is it for the Secondary nodes? I entered my MATCH cypher query to expand the tree here, but of no use. And when i include the Match query in the text-box i get the blank screen.

Match query in text-box included -

Match (cc:Company) WHERE cc.name = "Century123"
CREATE (eway:Service {name:"EWayBill", type:"Outbound", connectedTo:"SAP"}),
(sms:API {name:"SMS", type:"Outbound", connectedTo:"SAP"}),
(collection:Service {name:"Collection", type:"Inbound", connectedTo:"SAP"}),
(payments:Service {name:"Payments", type:"Outbound", connectedTo:"SAP"}),
(cc)-[:SERVICE]->(eway),(cc)-[:API]->(sms),(cc)-[:SERVICE]->(payments),(cc)-[:SERVICE ]->(collection)

I also have one more question. Where do i include the CREATE cypher which is the first query to create a node.


(Michael Hunger) #2

Usually you create data from your driver or in neo4j browser.

the query you included doesn't return any data.
You should also only use "read-only" queries there.

As you only put in the default query for APIs nodes only those are shown.


(Sucheta) #3

Hi Micheal,

[1]
What do you mean by "read-only" queries ?

I found two types of queries, Match and Create.

So is a MATCH a read-only query ?

[2]

Hi Micheal,

Let me tell you we are doing an Official Project with Neo4j.
When we utilize this particular code - as extracted and edited from -

neo4j-contrib/neovis.js/blob/master/examples/simple-example.html

 <!doctype html>
 <meta charset="utf-8"/>
 <html>
 <head>
     <title>Neovis.js Simple Example</title>
     <style type="text/css">
         html, body {
             font: 16pt arial;
         }
         #viz {
             width: 1200px;
             height: 650px;
             border: 10px solid #456789;
             font: 22pt arial;
         }
     </style>

     <!-- FIXME: load from dist -->
     <script type="text/javascript" src="https://rawgit.com/neo4j-contrib/neovis.js/master/dist/neovis.js">                                    
     </script>


      <script
        src="https://code.jquery.com/jquery-3.2.1.min.js"
        integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
        crossorigin="anonymous"></script>

     <script type="text/javascript">
    
        var viz;
         function draw() {
          var config = {
            container_id: "viz",
            server_url: "bolt://localhost:11001",
            server_user: "neo4j",
            server_password: "***",
            labels: {
                
                "API": {
                    "caption": "name",
                    "size": "pagerank",
                    "community": "community"
                    //"sizeCypher": "MATCH (n) WHERE id(n) = {id} MATCH (n)-[r]-() RETURN sum(r.weight) AS c"
                }
               },
              relationships: {
                "corebanking": {
                    "thickness": "weight",
                    "caption": false
                   }
               },
           
           initial_cypher :"MATCH (n) RETURN (n)"  ,                 
           arrows: false
            };                   
             viz = new NeoVis.default(config);
            viz.render();
            console.log(viz);
             }
        </script>
        </head>
      <body onload="draw()">
      <div id="viz"></div>


    Cypher query: <textarea rows="4" cols=50 id="cypher"></textarea><br>
    <input type="submit" value="Submit" id="reload">
     <input type="submit" value="Stabilize" id="stabilize">


     </body>

     <script>

       $("#reload").click(function() {
       var cypher = $("#cypher").val();
        if (cypher.length > 3) {
        viz.renderWithCypher(cypher);
          } else {
        console.log("reload");
        viz.reload();
          }
         });
        $("#stabilize").click(function() {
         viz.stabilize();
        })
    </script>
    <frameset cols="50%,50%">
      <frame src="frame_a.htm" frameborder="0">
      <frame src="frame_b.htm" frameborder="0">
    </frameset>
    </html>

We get this output -

Neo4j-js

Instead of getting the connected links as shown in the Neo4j Desktop Version below , we get Nodes of those Relationship variables ,despite getting proper links relation in desktop version-

Neo4j-2-desktop

Please help.


(Michael Hunger) #4

Neo4j Browser sends another query to fetch the relationships.

In Neovis you'd have to express the patterns and also return the relationships.

MATCH (n) OPTIONAL MATCH (n)-[r]->(m) RETURN n,r,m LIMIT 100


(Sucheta) #5

Thanks Michael. What in the following code will i need to input for patterns and relationships ? I don't know the keyword against which i need to place the relationship query that you mentioned. Please help

         var config = {
            container_id: "viz",
            server_url: "bolt://localhost:7687",
            server_user: "neo4j",
            server_password: "sorts-swims-burglaries",
            labels: {
             
                "Character": {
                    "caption": "name",
                    "size": "pagerank",
                    "community": "community"
        
                }
            },
            relationships: {
                "INTERACTS": {
                    "thickness": "weight",
                    "caption": false
                }
            },
            initial_cypher: "MATCH (n)-[r:INTERACTS]->(m) RETURN n,r,m"
        };

        viz = new NeoVis.default(config);
        viz.render();