Javascript 是否可以在d3.js中使用固定圆圈大小的圆圈包布局?
这个圆包布局示例()非常适合我正在处理的项目,但是它可以相对地调整所有圆的大小: 有没有一种简单的方法来指定每个圆的固定半径 我浏览了源代码、示例、google和stackoverflow,似乎找不到任何有用的东西Javascript 是否可以在d3.js中使用固定圆圈大小的圆圈包布局?,javascript,svg,d3.js,circle-pack,Javascript,Svg,D3.js,Circle Pack,这个圆包布局示例()非常适合我正在处理的项目,但是它可以相对地调整所有圆的大小: 有没有一种简单的方法来指定每个圆的固定半径 我浏览了源代码、示例、google和stackoverflow,似乎找不到任何有用的东西 圆圈的精确大小对我来说很重要。如果您遵循您给出的示例中的代码,则元素的大小将在此处确定: node.append(“圆”) .attr(“r”,函数(d){返回d.r;}) // ... 要将圆的大小固定为,例如,50,可以执行以下操作: node.append(“圆”) .at
圆圈的精确大小对我来说很重要。如果您遵循您给出的示例中的代码,则
元素的大小将在此处确定:
node.append(“圆”)
.attr(“r”,函数(d){返回d.r;})
// ...
要将圆的大小固定为,例如,50
,可以执行以下操作:
node.append(“圆”)
.attr(“r”,函数(d){return 50;})
// ...
更新 然而,这将打破评论中指出的布局。要解决此问题,可以向每个节点提供相同的
值
:
//返回包含根下所有叶节点的展开层次结构。
函数类(根){
var类=[];
函数递归(名称、节点){
if(node.children)node.children.forEach(function(child){recurse(node.name,child);});
push({packageName:name,className:node.name,value:node.size});
}
递归(null,root);
返回{子类:类};
}
致:
//返回包含根下所有叶节点的展开层次结构。
函数类(根){
var类=[];
函数递归(名称、节点){
if(node.children)node.children.forEach(function(child){recurse(node.name,child);});
push({packageName:name,className:node.name,value:1});
}
递归(null,root);
返回{子类:类};
}
这是可能的,而且很简单。第一个答案是准确的,但我相信我的答案更简单、更明确,所以我也附上了它
请看一看这个例子:
当您按下“常量”按钮时,您将看到如下内容:
关键代码行如下所示:
pack.value(function(d) { return 100; })
这将使圆半径与数据的比例保持恒定。当然,100可以是任何常数。您可以在circle pack初始化(很可能是您的情况)或重新初始化(如我的示例中)中应用这一行
希望这有帮助。谢谢您的回复!我确实试过了,但它破坏了布局:。它应该是这样的:用一个可能的补丁更新了答案。user2058412,你能看看我的答案吗?它对你有用吗?