Question

我对d3很新，对svg对象缺乏经验，我试图在页面上放置d3生成的圆形元素。我已经关注了几个不同的教程，并将它们混合在一起，并且无法弄清楚为什么我当前的代码不起作用。下面的HTML;

category()

和javascript（test.js）

<body>
<div id="svgDiv"></div>

<script src="~/Scripts/jQuery/jquery-1.10.2.min.js"></script>
<script src="~/scripts/d3/d3.min.js"></script>
<script src="~/scripts/App/test.js"></script>

</body>

所以这应该（并且确实）在x和y = 50,100,150 ...... 250点击时生成5个svg圆圈，但是所有5个圆圈在页面的左上角放置在彼此的顶部。 / p>

对此行为的任何见解都将非常感激，我的主要语言是C＃.net，d3目前似乎并没有点击我。

提前致谢

Answer 1

只需回答问题即可。（@Gerardo已在评论中解决了这个问题。）

使用属性cx和cy而不是x和y来定位SVG圆。（请参见Mike Bostock's circle tutorial）这是the fix：

在此问题的点击事件中，您将看到以下圆圈，而不是彼此重叠：

d3 svg圈在x，y上的位置

1 个答案: