force-layout

Static D3 Force-Directed Graph performance

送分小仙女□ 提交于 2019-12-10 22:36:28
问题 So currently I'm trying to create a force-directed graph of a couple thousand nodes and about 30k links in the graph. As you may guess, the simulation is very very slow. What I would like to do instead is to precompute all the positions for the nodes and just render a static (but interactive) graph. Is there a way to use d3.js to calculate a force directed graph without rendering it (making it much faster) and then just render the static graph from the pre-calculated values? My code is

Avoid links criss cross / overlap in d3.js using force layout

ぐ巨炮叔叔 提交于 2019-12-10 21:36:28
问题 How to avoid links overlap in d3.js using force layout ? I have divided screen into two halves, the upper half nodes are connected to bottom half nodes using links , sometimes there is a criss cross of links , how can i avoid that ? 回答1: The short answer is that you can't. The longer answer is that the force layout that D3 implements does nothing to prevent overlapping links and there are no parameters you can set to do that. What you can do is try to adjust the parameters that are there and

How to underline text within a node's label in d3 force based layouts?

ぐ巨炮叔叔 提交于 2019-12-10 19:47:17
问题 I am working with a d3 force based graph, whose node labels are in fact URLs, which when clicked, take the user to the target URL. For usability reasons, is there a way to underline the url? Better yet, can the underline appear and disappear, can the color of the text be changed, as the user hovers over a certain label? This would help users understand that the labels are clickable. Please help. document.addEventListener('DOMContentLoaded', function () { drawVisual(); }); var QueuedORG = [];

Multiple force-layout graphs with d3 in seperate svg/div's

拜拜、爱过 提交于 2019-12-10 16:45:28
问题 I've a problem with creating multiple force layout graphs using d3 and reading data from a json file. I use a for loop to iterate over the graphs, create a separate div containing a svg for each. The problem is, that the force layout is only applied to the last one created, so basically the others just show a dot in the upper left corner. I could solve it partly by putting a for loop at the end of each iteration, but I still lose the interaction capabilities of the separate figures. Find the

d3.js - Force-Layout boundary issue V4

做~自己de王妃 提交于 2019-12-10 16:21:02
问题 Currently I am working one of FCC's project National Contiguity Essentially I was able to figure it out how to render the flags sprites and connect the nodes and its links. The only thing that I am having trouble is implementing is how to behave similar to FCC's example. Specifically I am trying ways to have the nodes to repel away from the boundries like in the example. However, mine doesn't behave that way (in fact, it's very clustered but I don't know exactly what properties in the d3.js

Setting up D3 force directed graph

我们两清 提交于 2019-12-10 13:48:11
问题 To the esteemed readers. I'm reasonably new in javascript and I have come across this problem. I'm trying to implement a modified version of this force directed graph: http://mbostock.github.com/d3/ex/force.html The json data is generated on the fly from a php script. The idea is to color all lines connecting to one specific node ( defined in a php script) in one color and all the others in shades of gray. I'm attempting to do it by matching the source variable in the json file to the

d3 force graph: sticky nodes

被刻印的时光 ゝ 提交于 2019-12-10 13:13:17
问题 I would like to add a behavior to a force directed graph layout in D3 in such a way that once dropped, a dragged-and-dropped svg node sticks in its place, no longer changing position no matter what else happens in the graph. I have done some reading about this API but I can't figure out a way to get that one working. The problem I am trying to solve is allowing a user to "pick apart" a complex force graph. 回答1: Set the fixed property of the node to true on mousedown. node.on("mousedown",

d3js force layout with hide/unhide on node click misplaces nodes after expanding

隐身守侯 提交于 2019-12-10 11:45:42
问题 I am trying to create a graph using d3 and force layout. I have used the following example http://bl.ocks.org/mbostock/1062288 to get started: I also need images and labels so I looked at this example http://bl.ocks.org/mbostock/950642 to get an idea how I could add them. My graph will also get bigger depending on the user interactions with the nodes so if a user clicks on a node that doesn't have children, an ajax request will go to the backend service to request more nodes. The graph is

d3.js Maximum call stack size exceeded error

狂风中的少年 提交于 2019-12-10 11:27:54
问题 When I try to layout my force-directed graph, the following is the error I receive. I read about this issue in Mike Bostock's github page and found that it might be due to NaN values of coordinates or all the points drawn at the same point. I checked into the console and I found that all of my points are getting drawn at the same X and Y values. On an example data, the code worked perfectly well but no more now. My data goes like 45-50 levels away from the center node. I have successfully

Create node cluster's focal points by data attribute in d3?

断了今生、忘了曾经 提交于 2019-12-10 10:58:52
问题 I'm trying to force nodes into different clusters in force layout based on a certain attribute in the data like "group." I'm adapting the code from Mike Bostock's multi foci force layout example (code, example) and I've been successful in adding in my own data but I haven't been able to specify how many clusters there are and how to assign a node to a cluster. I'm relatively new to d3 and JavaScript and I haven't been able to find many examples of multi foci applications. Here's my d3 code,