Question

我在DOM上有一个空的SVG元素。

我在DOM上也有其他SVG，并且每个SVG中都有一个SVG形状。

我可以更改SVG元素（如圆和矩形）的位置，以便通过更改其cx / cy x / y来在空SVG元素内移动。

我正在使用viewportElement.getScreenCTM（），然后使用transform方法，该方法为我提供了要将元素移动到的SVG内部的点。

我也想对多边形元素进行处理。

我知道有一个点属性，但是我似乎无法更改所有值以使多边形从点x / y移动到点x2 / y2。（我知道形状有多个x / y）

我正在使用香草JS。

已更新为HTML：

我想将#pathSvg内的元素移动到#targetSvg中，以便将其作为它的子元素嵌套在其中，以便在鼠标移动事件中移动元素。

例如，如果我将元素移动到“目标SVG元素”中的x / y位置，则希望将其作为子元素放置在该位置。

希望现在更加清晰。

<div>
  <svg>
      <circle id="circle" cx="50" cy="50" r="40" />        
    </svg> 
</div>

<svg height="80" width="100" id="pathSvg">
      <path id="tria" d="M 10,150 L 70,10 L 130,150 z" style="fill:rgb(47, 194, 164)"/>
      Sorry, your browser does not support inline SVG.  
    </svg>

<div class="svg-container">
  <svg height="100%" width="100%" id="targetSvg">
  </svg>
</div>

更改SVG多边形元素的位置

0 个答案: