dimple.js:嵌套svg元素

时间:2016-07-30 07:20:21

标签: d3.js svg dimple.js

我正在尝试修改dimple.js的{​​{3}},每个子弹图都在parent-svg的child-svg中。为每个子弹图设置单独的svg的目的是使他们的管理(显示/隐藏/删除)更容易。此外,这使得图表的递归定义完成 - 也就是说,图表包含在svg中。

Bullet Charts example

正如您所看到的,从第2张图表开始,鼠标悬停时,工具提示不合适!请注意,对于child-svg,我设置了样式overflow: visible,而根本没有看到工具提示。

想知道我是否在处理child-svg元素的属性时遗漏了任何内容,或者它是否是dimple.js中的错误。另外,如果您知道任何解决方法,请告诉我。

感谢。

1 个答案:

答案 0 :(得分:0)

我遇到的第一个问题是为什么你想要孩子的svg元素?你想达到什么目的? 我在你的代码和示例中看到的唯一区别是顶部的高度/宽度交换和子svg +边界。

请记住,原点随每个子svg而变化。这可能就是您在使用工具提示时遇到问题的原因。也许你已经在你的add-bullet调用中工作了。

如果你真的想要单独的svg元素,我认为nagu在这里有正确的方法。