将一个圆圈拖放到另一个圆圈内，重新调整大小并自动调整答案

【问题标题】：drag and drop a circle inside another circle with re size and auto adjust将一个圆圈拖放到另一个圆圈内，重新调整大小并自动调整
【发布时间】：2015-09-11 12:08:44
【问题描述】：

我想创建类别（较大的圆圈），然后创建子类别（较小的圆圈），这样#category 是使用 D3 js 的 #subcategory 的父级。

类似https://www.droptask.com/

*我需要将圆圈拖放到#category 圆圈内，我可以这样做。

http://bl.ocks.org/mbostock/4063530

我想调整并自动调整圆圈，我可以将该圆圈拖到另一个圆圈，它成为圆圈的子类别。

我无法在包布局中正确使用武力。有人可以建议一种方法。

【问题讨论】：

您的问题标题模糊且太长，请重新框定标题。你试图达到的目标是可能的，我相信没有这样的例子。

标签： javascript d3.js svg

【解决方案1】：

当然可以。这是我将如何解决这个问题。

创建组层次结构。

假设您是洞穴类别和子类别。我会这样做。

<g id='category'></g>
<g id='sub_category'></g>

无论您想要什么形状，您都可以在组内绘制它们。

<g id='category'>
   <circle>...</circle>
   <circle>...</circle>
</g>
<g id='sub_category'>
   <circle>...</circle>
   <circle>...</circle>
   <circle>...</circle>
</g>

现在您可以编写拖动事件。对于类别圈。为了将子类别拖放到某个类别，请为类别组创建一个“mouseover”事件，当您在类别圈上时设置一个布尔值，当您删除子类别时，请确保设置了布尔值。（显然你必须在mouseout 上取消设置它）。

我希望你能明白。试试看。回来工作吧，我们可以提供更多帮助。

【讨论】：

我为这项工作创建了一个 jsfiddle。下面是链接：jsfiddle.net/shishiruu/r1mz2apr/2 我希望我的侧边栏元素拖动并附加到 rightSection 组。 rightSection 的元素也是可拖动的。这看起来很有效。当我将 rightSection onload circle(#id1) 拖动到任意点然后拖放左侧部分时，我无法定位内圈。我该如何解决这个问题？而且我认为我没有有效地使用组元素。请推荐！！谢谢
您目前的问题是什么？
我目前的问题是我无法弄清楚如何在上应用强制布局，以使外圈不与其他外圈重叠内圈不与其他内圈重叠。再次感谢。