这个圈子组布置的一例(http://bl.ocks.org/4063269)是一个完美的项目我的工作,但它大小都是相对的圆圈彼此:可能在d3.js中使用固定圈大小的圆形包布局?
是否有指定固定半径的简单方法每个圈子?
我搜索了源代码,例子,谷歌和stackoverflow,似乎无法找到任何有用的东西。
圆圈的确切尺寸对我很重要。
这个圈子组布置的一例(http://bl.ocks.org/4063269)是一个完美的项目我的工作,但它大小都是相对的圆圈彼此:可能在d3.js中使用固定圈大小的圆形包布局?
是否有指定固定半径的简单方法每个圈子?
我搜索了源代码,例子,谷歌和stackoverflow,似乎无法找到任何有用的东西。
圆圈的确切尺寸对我很重要。
如果你按照你给的例子代码中,<circle>
元素的尺寸正在这里决定:
node.append("circle")
.attr("r", function(d) { return d.r; })
// ...
要解决的圈子,说,50
,你可以做到这一点的大小:
node.append("circle")
.attr("r", function(d) { return 50; })
// ...
这意志,howeve r,如评论中指出的那样打破布局。为了解决这个问题,一个可以提供相同的value
到每个节点:
// Returns a flattened hierarchy containing all leaf nodes under the root.
function classes(root) {
var classes = [];
function recurse(name, node) {
if (node.children) node.children.forEach(function(child) { recurse(node.name, child); });
else classes.push({packageName: name, className: node.name, value: node.size});
}
recurse(null, root);
return {children: classes};
}
到:
// Returns a flattened hierarchy containing all leaf nodes under the root.
function classes(root) {
var classes = [];
function recurse(name, node) {
if (node.children) node.children.forEach(function(child) { recurse(node.name, child); });
else classes.push({packageName: name, className: node.name, value: 1});
}
recurse(null, root);
return {children: classes};
}
感谢您的回复!我实际上尝试过,但它打破了布局: http://cl.ly/image/2M3o1T2n2k1V。它应该看起来的样子是:http://cl.ly/image/1U1b3v3m152W – user2058412 2013-02-12 03:58:24
更新了可能的修复答案。 – 2013-02-12 06:52:11
这是可能的,简单的事。第一个答案是准确的,但我相信我的是更简单,更明确,所以我也附加它。
请看看这个例子:jsfiddle
当你按下“恒”按钮,你会看到这样的事情:
关键代码行是这样的:
pack.value(function(d) { return 100; })
这将使数据圆圈半径不变。 100当然可以是任何常数。你可以在circle pack初始化中应用这一行(很可能这是你的情况),或者重新初始化(就像我的例子)。
希望这会有所帮助。
user2058412,你能看看我的答案吗?对你有用吗? – VividD 2014-06-26 11:15:04