force-layout

问题 I'm using D3 generated Radio Buttons to toggle the size of Nodes in a FDG Layout (on mouse click) from a default size to a scaled magnitude. You can find the Radio Buttons in the upper left hand of the Node Cluster Diagram (http://nounz.if4it.com/Nouns/Applications/A__Application_1.NodeCluster.html) The code that toggles the node circles between a default number and a scaled magnitude looks as follows... var densityControlClick = function() { var thisObject = d3.select(this); var typeValue =

问题 I am trying to use and understand the D3 visualization library (http://mbostock.github.com/d3/), and I am looking at their force directed code and it seems they are using a quadtree to calculate the force on a particle. The code is var k = kc * quad.count * dn * dn; node.px -= dx * k; node.py -= dy * k; where it seems thay quad.count is the number of particles in the quadtree node. But looking at their quadtree code in https://github.com/mbostock/d3/blob/master/d3.geom.js#L696, I can't find

问题 I'm trying to pre-calculate the positions of the stable force directed graph using igraph and pass them into my d3.js graph. This is due to the size of the dataset I will be using which means I cannot rely on the client not to freeze if the full force calculation is done on client-side. I have the positions in JSON format and have used linear scales in order to make them useful in d3.js. var positions = {"positions": [{"x":"-68.824367374", "y": "-6.10824525755"}, {"x":"-80.8080803911", "y": "

问题 I'm trying to generate a collapsible force layout similar to this example: http://bl.ocks.org/mbostock/1062288: The data being used to generate my force layout is a JSON object being sourced from an API. I am successfully able to traverse the data structure, and generate nodes that are appended to the SVG (both root nodes and their children). However, the issue comes with linking the parent nodes to their children nodes. Links are not being generated, and my links variable is returning an

问题 I am attempting to create a force layout where not all the nodes connect with links. Additionally, I got some terrific help with centering a node when it is clicked (reference to question here). I would like to incorporate the two together, but am a bit stuck. I created a JSFiddle where I modified the original data where not every node has a link; however, as you can see from the Fiddle, only a single node is drawn and nothing else is displayed. The data looks something like this: [ { "name":

问题 I am currently implementing arrows in my force layout as is done in this example (http://bl.ocks.org/mbostock/1153292) and that works perfectly. However, one will quickly realize that the location and size of the arrows are hard-coded here since the nodes never change size. I have a graph were I dynamically change node sizes, and as such I would like the arrows to update accordingly since otherwise they are covered by the node or cover the node or are just not attached to the node. There is

问题 I would like to highlight the edges of a graph when the connected nodes are hovered. I took inspiration from the Bundle example: However the on() function is not giving the d object to the onmouse function: d3.json("graph_file.json", function(json) { force .nodes(json.nodes) .links(json.links) .start(); var link = svg.selectAll("line.link") .data(json.links) .enter().append("line") .attr("class", function(d) { return "link source-" + d.source.key + " target-" + d.target.key; }) .style("stroke

问题 I'm using the force-directed layout in d3 and I'm running into a bit of a snag in development. var circle = svg.append("svg:g").selectAll("circle") .data(force.nodes()) .enter().append("svg:circle") .attr("r", function( d ) { return d.fValue; }) .style('fill', function( d ) { return strokeColor( d.name ); }) .call(force.drag); Basically, I want to add more event listeners to the 'drag' behavior defined by force.drag - namely, I want to make sure that the nodes change color on drag (not on

问题 Here is jsfiddle: This is really good if you have, let's say, 2 political parties, and you want to present election results across several voting units, or similarly structured data. However, I need to visually represents this: (5 political parties instead of 2) (please ignore all raws except "seats"; only "seats" are supposed to be visualized) I would like to have a circle pack inside each force layout node . For example, there should be a balloon called BC containing four smaller circles

问题 I'm trying to add different shapes to my d3 force layout but unsucessfully. The end goal is determine the shape based on properties of the node object itself. I'm using selection.enter() to then .append() the shapes like so. As the force directed layout only takes one array of nodes, and .append() takes a string and not a function node = vis.selectAll('.node') .data(nodes, function(d) { return d.filename }); then... node.enter() .append(**'rect'**) //I need to vary this based on node