在d3力布局中将节点放置在屏幕中心
在d3力布局中将节点放置在屏幕中心
提问于 2015-03-31 06:47:47
如何将节点放置在d3.js中的力布局的中心。这里我得到了JSON数据，如下所示
"nodes": [{
"cName": "User",
"cImage_url": "/final/images/component_icons/user_image.png",
"x": 49.99999999999999,
"y": 150,
"fixed": true
}, {
"cType": "Oracle WebLogic",
"cName": "weblogic177:7001",
"cImage_url": "/final/images/Light/component_icons/APPLICATION_SERVERS.png",
"x": 167,
"y": 150,
"fixed": true,
"AlarmPopup": "WebLogic_server:weblogic177:7001",
"cStateImage_url": "/final/images/Light/state20_INTERMEDIATE.png",
"linktoLayermodel": "/final/monitor/EgDispLayers.jsp?site=egurkha.physical.topology&qctr=0&host=weblogic177:7001&comptype=Oracle WebLogic&comeFrom=topology&To=layerMode&isFromZone=null&iszoneName=&parentZone=null&tab=LayerModel&toDashBoardLayer=true"
}, {
"cType": "Group",
"cName": "hari11",
"cImage_url": "/final/images/component_icons/group.png",
"x": 283.99999999999994,
"y": 49.99999999999999,
"fixed": true,
"AlarmPopup": "Group:hari11:NULL",
"cStateImage_url": "/final/images/Light/state20_LOW.png",
"linktoLayermodel": "/final/monitor/EgDisplayGroups.jsp?ptype=group&showsitesegments=false&group=hari11&serverType=Group&site=egurkha.physical.topology&segmentName=sample&fromHomepage=true"
}..所以节点总是从屏幕的左角开始，但是我需要从中间开始。
那么我如何操作JSON数据中现有的x，y呢？
回答 1
Stack Overflow用户
回答已采纳
发布于 2015-03-31 09:07:56
就像拉斯说的那样。
force.on("tick", function() {
nodes[0].x = w / 2;
nodes[0].y = h / 2;}这会将第一个节点放在屏幕的中间(节点表示第一个节点)，如果希望所有节点都向右移动，请执行如下操作：
var movement = 200;
node.attr("transform", function(d)
{
return "translate(" + movement + "," + 0 + ")"; }); //Here you move the nodes
;这基本上通过节点并将每个节点移动到正确的200 to。我对链接也是这样做的：
link.attr("transform", function(d)
{
return "translate(" + movement + "," + 0 + ")"; }); //Here you move the links
;更新的JSFiddle：http://jsfiddle.net/aVhd8/159/
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/29362298
复制相关文章
相似问题
腾讯云开发者
