我正在尝试实现一个简单的力布局,其中可以动态添加和删除节点(没有链接)。我成功地在D3版本3中实现了这个概念,但我无法将其转换为版本4。添加和更新节点后,模拟卡住并且传入的圆圈绘制在svg的左上角。有人知道为什么会这样吗?感谢您的帮助:)我的概念是基于这个解决方案:AddingnewnodestoForce-directedlayoutJSFiddle:workingcodeind3v3/*Defineclass*/classPlanet{constructor(selector){this.w=$(selector).innerWidth();this.h=$(selector).i
我正在研究一些图形可视化,我正在使用JavaScript库graphDracula.现在,有了这个库,当我想移动一个节点时,我必须单击我想移动的节点并将它移动到所需的位置(通过拖放)。但是,我想要做的是选择更多节点并移动所有节点。我不知道该怎么做,因为我在JavaScript编程方面经验不足。所以,我的问题是:如何使用矩形选择和移动来选择多个节点他们?如何选择多个节点,例如,Ctrl+左键单击并选择更多节点然后移动它们? 最佳答案 从表面上看,几乎所有Dracula的图形渲染都是由RaphaelJS管理的。.在这种情况下,事情对您来
我想为D3中的力导向图布局添加一个行为,这样一来,拖放的svg节点会固定在它的位置,无论发生什么,都不再改变位置图形。我已经阅读了一些有关此API的资料,但我想不出一种方法来使它正常工作。我试图解决的问题是允许用户“分离”一个复杂的力图。 最佳答案 在mousedown时将节点的fixed属性设置为true。node.on("mousedown",function(d){d.fixed=true;});例如:http://bl.ocks.org/3750558 关于javascript-
我已经使用javascript工作了一个星期了。我目前正致力于通过节点使事情工作/改变。但我一直注意到一些奇怪的事情,对于一个不熟练的javascripter来说确实如此。我的网站结构如下:....当我试图找到具有下一个函数的子节点时:varheaderBox=document.body.childNodes;vartxt="";for(varx=0;x";}varx=document.getElementById(box);x.innerHTML=txt;我得到一个列表,其中包含几个未定义的“NULL”以及真实的DIV但是当我简单地将“document.body.childNodes
我想我有一个非常简单的问题,很难说出来,因此很难找到解决方案。设置:PathCollection是一个Backbone.CollectionofPathsPath是一个Backbone.Model,它包含NodeCollection(它是一个Backbone.Collection)和EdgeCollection(它是一个Backbone.Collection)。当我获取PathCollectionpaths=newPathCollection()paths.fetch()显然,路径被实例化。但是,我缺少可以允许Path从属性哈希实例化其子模型的地方。我真的不能使用解析,对吧?基本上,我
我正在使用JSTreegraph绘制树结构的插件。但是现在我需要一个拖放和附加功能,其中我可以拖动树的任何节点并附加到任何其他节点,随后第一个节点的所有子节点现在将成为新节点的孙节点(它被附上)。据我所知这个插件似乎没有这个功能。它只是根据传递给它的数据对象绘制结构。该插件基本上将一个类Node分配给树的所有节点(divs),将另一个类NodeHover分配给悬停的节点。没有id分配给这些div。所以我尝试使用JQueryDraggable来查看是否可以通过这样做移动任何节点$('.Node').draggable();$('.NodeHover').draggable();但是好像不
示例:http://mbostock.github.com/d3/ex/bubble.html我很难理解第16行发生了什么:.data(bubble.nodes(classes(json))为什么,或者在classes()函数中,变量classes[]获得为其每个对象定义的x、y、r值。另外,bubble.nodes()似乎不是一个实际的函数?如果我添加一个console.log(classes)在第44行和第45行之间-内部的每个对象似乎都已经填充了x,y,r-但不清楚为什么会发生这种情况。 最佳答案 对bubble.nodes(
基于两个D3示例:力布局(http://bl.ocks.org/mbostock/1095795)和集群力布局(http://bl.ocks.org/mbostock/1748247),我设法构建了一个力布局,其中有几个独立的重力点来控制节点在链接顶部的位置节点。//Setupmapfunctionmap_init(){force=d3.layout.force().nodes(nodes).links(links).size([width,height]).on("tick",tick);svg=d3.select("#map").append("svg").attr("width"
我在D3力导向布局中有节点设置为.fixed=true。如果我设置.x或.y值,节点本身不会移动到它们的新位置。这是我的功能:functionfixNode(idArray,locationX,locationY){for(x=0;x更新1:这是基于Jason的建议的工作函数:functionfixNode(idArray,locationX,locationY){for(x=0;x 最佳答案 力导向布局与实际渲染分离。通常你有一个tick处理程序,它会为布局算法的每个“tick”更新你的SVG元素的属性(解耦的好处是你渲染到或其他
我想在D3.js中动态更新网络图。现在我的代码是:varcolor=d3.scale.category20();varmy_nodes=[{"cluster":0,"x":50,"y":50},{"cluster":0,"x":100,"y":50},{"cluster":1,"x":100,"y":100}];varvis=d3.select("body").append("svg").attr("width",500).attr("height",500);varnodes=vis.selectAll("circle.node").data(my_nodes).enter().ap