Thanks!
Yes I know about fill and stroke, and I saw some stuff about using force layout.
I haven't played around with animating(!) changes yet. I'll let you know how it goes! :0 Sam Michael Hunger wrote:
You can do both, either update your data in Neo4j with cypher and update the visualization. But you can also just run the color spreading only in the viz.the two d3 styles that you would want to change dynamically are *fill* and *stroke* (node outline and relationship-line-color).Something like this. // render relationships as lines var link = svg.selectAll(".link") .data(graph.links).enter() .append("line").style("stroke",function(d) { return d.color; }); // render nodes as circles, css-class from label var node = svg.selectAll(".node") .data(graph.nodes).enter() .append("circle") .style("fill",function (d) {return d.color; })From here: http://neo4j.com/developer/guide-data-visualization/I also link: http://www.coppelia.io/2014/07/an-a-to-z-of-extra-features-for-the-d3-force-layout/which contains a ton of info on d3 graph-viz. MichaelAm 24.02.2015 um 17:48 schrieb Samantha Zeitlin <[email protected] <mailto:[email protected]>>:any path or paths, starting from any node and spreading, either to all nodes or a limited set of nodes.First, I want to visualize when one attribute is changed on one node, traversing all the connected nodes to propagate that same change. Second, I want to do the same thing but be able to limit it to a certain number of connected nodes.I was wondering if it would be possible to do this by using cypher to add or modify an attribute, which could be used to specify some display property (like color)? Then I was wondering whether it makes sense to iterate over updating the display each time a node is modified, to show how this proceeds node by node, through the graph.sam Michael Hunger wrote:Coloring can be done in d3 via svg attributes or vis css (static) What exactly do you want to animate? From where to where? Von meinem iPhone gesendet Am 24.02.2015 um 02:12 schrieb Samantha Zeitlin<[email protected] <mailto:[email protected]> <mailto:[email protected]>>:I'd like to try something similar, but I want to be able to change the colors (nodes and/or relationships, whatever is easiest) and animate that (slowly enough that a human can actually watch it go). Do you have any examples where you've done that? I can imagine that it should be doable with d3. On Tuesday, February 3, 2015 at 2:40:42 PM UTC-8, Michael Hunger wrote: Could you try to use the d3 version that we use here: https://github.com/neo4j-contrib/developer-resources/blob/gh-pages/language-guides/assets/index.html#L87 <https://github.com/neo4j-contrib/developer-resources/blob/gh-pages/language-guides/assets/index.html#L87> http://d3js.org/d3.v3.min.js In action: http://my-neo4j-movies-app.herokuapp.com/ <http://my-neo4j-movies-app.herokuapp.com/> MichaelAm 03.02.2015 um 21:29 schrieb Arvind Upadhyay <[email protected] <http://gmail.com> <javascript:>>: hello guys, this question is more d3 centric than neo4j based. I copied the example from neo4j website for visualization and it does not seem to work. I am using latest version of d3.js to prototype visualization using neo4j. Error seems to be from d3.js library itself Uncaught TypeError: Cannot read property 'weight' of undefined d3.min.js:4 here is the code i copied from neo4j site ("dependencyManager" is the id of svg element) res ={"nodes":[{name:"Peter",label:"Person",id:1},{name:"Michael",label:"Person",id:2},{name:"Neo4j",label:"Database",id:3}], "links":[{start:0, end:1, type:"KNOWS", since:2010},{start:0, end:2, type:"FOUNDED"}, {start:1, end:2, type:"WORKS_ON"}]}; var graph ={"nodes":[{name:"Peter",label:"Person",id:1},{name:"Michael",label:"Person",id:2},{name:"Neo4j",label:"Database",id:3}], "links":[{start:0, end:1, type:"KNOWS", since:2010},{start:0, end:2, type:"FOUNDED"}, {start:1, end:2, type:"WORKS_ON"}]}; var width = 800, height = 800; // force layout setup var force = d3.layout.force() .charge(-200).linkDistance(30).size([width, height]); // setup svg div var svg = d3.select("#dependencyManager") .attr("width", "100%").attr("height", "100%") .attr("pointer-events", "all"); // load graph (nodes,links) json from /graph endpoint force.nodes(graph.nodes).links(graph.links).start(); // render relationships as lines var link = svg.selectAll(".link") .data(graph.links).enter() .append("line").attr("class", "link"); // render nodes as circles, css-class from label var node = svg.selectAll(".node") .data(graph.nodes).enter() .append("circle") .attr("class", function (d) { return "node "+d.label }) .attr("r", 10) .call(force.drag); // html title attribute for title node-attribute node.append("title") .text(function (d) { return d.title; }) // force feed algo ticks for coordinate computation force.on("tick", function() { link.attr("x1", function(d) { return d.source.x; }) .attr("y1", function(d) { return d.source.y; }) .attr("x2", function(d) { return d.target.x; }) .attr("y2", function(d) { return d.target.y; }); node.attr("cx", function(d) { return d.x; }) .attr("cy", function(d) { return d.y; }); }); -- You received this message because you are subscribed to the Google Groups "Neo4j" group. To unsubscribe from this group and stop receiving emails fromit, send an email to [email protected] <http://googlegroups.com> <javascript:>.For more options, visit https://groups.google.com/d/optout <https://groups.google.com/d/optout>.-- You received this message because you are subscribed to the Google Groups "Neo4j" group. To unsubscribe from this group and stop receiving emails from it,send an email to [email protected] <mailto:[email protected]><mailto:[email protected]>. For more options, visit https://groups.google.com/d/optout.-- You received this message because you are subscribed to a topic in the Google Groups "Neo4j" group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/neo4j/REh1ZJnU80s/unsubscribe. To unsubscribe from this group and all its topics, send an email to[email protected] <mailto:[email protected]><mailto:[email protected]>. For more options, visit https://groups.google.com/d/optout.--You received this message because you are subscribed to the Google Groups "Neo4j" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected] <mailto:[email protected]>.For more options, visit https://groups.google.com/d/optout.--You received this message because you are subscribed to a topic in the Google Groups "Neo4j" group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/neo4j/REh1ZJnU80s/unsubscribe. To unsubscribe from this group and all its topics, send an email to [email protected] <mailto:[email protected]>.For more options, visit https://groups.google.com/d/optout.
-- You received this message because you are subscribed to the Google Groups "Neo4j" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. For more options, visit https://groups.google.com/d/optout.
