问题标签 [circle-pack]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - Manipulate d3.js pack layout with HTML5 Range Input
I have this http://jsfiddle.net/thechrisjordan/p4Fwm/11/, where I'm manipulating a d3 pack layout with an HTML5 slider. Everything is working as I would like except for how the nodes are ordered when updateVis() is called.
This code is pretty straight forward: I'm creating the layout, and then the slider emits an event which causes the layout to update.
What I'm hoping to achieve is this same behavior but to have the child nodes remain in their same general areas in the pack as they change size. As you can see, they reposition themselves here.
It looks like my issue is line 69 where pack.nodes(data);
is called. I've dug into d3 source but can't figure out how to prevent this reordering (and it may very well not be possible...).
I suppose an alternative would be to try and squeeze the pack layout into a force layout.
I'm brand new to d3 and am grateful for any insight here.
javascript - 如何允许 layout.pack() 大小在 d3 中自由形式?
我正在使用 d3.layout.pack(),其中我有一堆数据以不同大小的圆圈表示。这些圆圈的大小会发生变化,但是我如何使最外层的圆圈(所有节点都绑定在其中的圆圈)的大小也发生变化?我想显示总数的增加/减少变化。
javascript - 如何在 d3 圆形包装图中创建链接(href)标签?
我正在处理这个例子: http: //mbostock.github.io/d3/talk/20111116/pack-hierarchy.html
我对 d3 非常陌生,并且很难将标签(在最大放大级别)链接到外部站点。
html - 结合两个d3可视化
我在一个页面上结合了两个 d3 可视化,需要 CSS 帮助。在这一点上,他们出现在彼此之上,我很沮丧。这两个可视化是:http ://bl.ocks.org/mbostock/3883245 :
和http://bl.ocks.org/mbostock/4063269:
此时我刚刚合并了两个 index.html 文件。任何关于我应该如何设置样式以使它们不重叠的指针将不胜感激!
javascript - 使用 d3.js 附加多个气泡云图
我正在使用这个气泡图来构建我自己的版本。http://bl.ocks.org/mbostock/4063269 在单个页面上附加图表的多个副本以进行比较似乎只附加图表的一个副本。它可能会在另一个上附加相同的图表。我的问题是这段代码中的什么导致只显示一个图表?在同一页面上使用相同代码(图表)的多个副本时,如何避免此问题?是否有指导方针或一些基本原则来防止这种情况?
javascript - 我可以在 D3 气泡图中强制气泡大小比率吗?
根据特定标准,我创建了一个最多包含 4 个图表的网页。一切看起来都很棒。现在客户希望 4 个图表中的气泡大小比率保持一致(即,2000 的值在每个图表中用相同大小的气泡表示。)
是否可以配置bubble.nodes()
生成器来执行此任务?
我知道我可以提供一个 radius() 计算器,但我没有数学背景来计算给定数据集的最佳半径。
我正在使用包布局。经过一夜好眠,我想我想出了一个可行的解决方案。在为每个图表生成布局后,我可以找到每个图表中最大气泡的半径与值的比率,scale()
并对其他 SVG 应用转换以使比率相同(或足够接近)。
javascript - 保持 D3 圆形包的纵横比 - 响应式设计
所以我正在处理 D3.js 中的气泡图:http: //bl.ocks.org/mbostock/4063269。宽度和高度由直径决定。所以我问:如何使这个 SVG 气泡云和任何其他 SVG 响应尽可能少的重新编码?