Hello dear community,
I hope you could help me understand better the following issue, it's very important for me to understand.
I'm trying to visualize my existing graph in neo4j with neovis.js tool. The purpose of the graph is just to calculate the functions you can see in red the following image.(the idea is that a real node for me, is the one I wanna see in the visualization, the "CellInstance" and he is connected in neo4j to attributes of: CellType(if it is a simple input/addition/substratioc,etc), the function, and a variable in green, these node I want to see as properties but not as more nodes in the visualiztion). I try understand what is correct way to use my entities and in which way will it be right to implement it.
my graph looks like this for example in neo4j:
my purpose is to see in my visualization only the orange node(CellInstance) and the graph node(subgraph instance in green here) it connected to, also i want in someway to show what parameters entering to my following CellInstance (maybe on the relations) and that cellInstance will have the function it represent.
here is an example of what I've tried to do in the visualization side:
and what i've wrote meanwhile in the code
<!doctype html>
<html>
<head>
<title\>Neovis.js Simple Example</title\>
<style type\="text/css"\>
html, body {
font: 16pt arial;
}
#viz {
width: 900px;
height: 700px;
border: 1px solid lightgray;
font: 22pt arial;
}
</style\>
<!-- FIXME: load from dist -->
<script src\="[https://unpkg.com/neovis.js@2.0.2](https://unpkg.com/neovis.js@2.0.2)"\></script\>
<script
src\="[https://code.jquery.com/jquery-3.2.1.min.js](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 = {
containerId: "viz",
neo4j: {
serverUrl: "bolt://localhost:7687",
serverUser: "neo4j",
serverPassword: "retinax"
},
labels: {
SubGraphInstance: {
label: "name",
value: "pagerank",
group: "community"
},
CellInstance: {
label: "name",
value: "pagerank",
group: "community"
}
},
relationships: {
FROM\_GRAPH: {
caption: true,
thickness: "count",
},
FROM\_CELL: {
caption: true,
thickness: "count",
},
CELL\_TYPE\_FUNCTION: {
caption: true,
thickness: "count",
},
FUNCTION\_INPUT\_VARIABLE: {
caption: true,
thickness: "count",
},
FUNCTIONS\_VARS: {
caption: true,
thickness: "count",
},
FUNCTION\_INPUT\_VARIABLE: {
caption: true,
thickness: "count",
},
TO\_CELL: {
caption: true,
thickness: "count",
},
},
initialCypher: "MATCH (n)-\[r\]->(m) RETURN n,r,m"
};
viz = new NeoVis.default(config);
viz.render();
console.log(viz);
}
</script\>
</head>
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>
</html>
thank you ,
Vera.