如何使特定元素出现在D3.js中的其他元素之上？
如何使特定元素出现在D3.js中的其他元素之上？
提问于 2014-04-17 17:09:51
我在D3中画了一个图，画了一些圆圈，然后画了一些椭圆来显示中间值。我的中位数有1.5秒的延迟，试图在圆圈出现后画出来，但我仍然遇到了一些问题。
下面是一个示例的屏幕截图：http://puu.sh/8csEK.png
最右边的圆圈在中间，其余的圆圈都在前面。当区域拥挤时，你就不能再看到中间值了。
我甚至尝试过在我的圆圈转换中使用以下内容，但这是没有用的：
.each("end", <call function to draw ellipses>)所以我的问题是，如何确保我的椭圆画在我的圆圈上面？我有一个绘制椭圆的函数，还有一个现在画圆圈的函数。
回答 1
Stack Overflow用户
回答已采纳
发布于 2014-04-17 17:22:07
我假设您使用SVG来呈现元素。在SVG中，显示顺序是绘制/附加到DOM的顺序。也就是说，首先附加的元素在后面绘制，最后附加的元素在前面。子元素(例如，在g下面的东西)是在绘制父元素时绘制的。
为了确保元素组具有正确的顺序，通常最容易将它们添加到按正确顺序绘制的不同SVG组中。在代码中，这看起来像这样。
var circles = svg.append("g");
var ellipses = svg.append("g");
// ...
ellipses.append(...); // this element appears in the front although it is drawn
// earlier because it is appended to the group appended last
circles.append(...); // this element appears behind the one appended to ellipses页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/23139329
复制相关文章
相似问题
腾讯云开发者
