获取椭圆svg是否已在路径内移动

时间:2018-09-25 10:48:26

标签: javascript html5 svg drag-and-drop

我有这个svg代码:

<svg
   xmlns:dc="http://purl.org/dc/elements/1.1/"
   xmlns:cc="http://creativecommons.org/ns#"
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   width="210mm"
   height="297mm"
   viewBox="0 0 744.09448819 1052.3622047"
   id="svg4140"
   version="1.1"
   inkscape:version="0.91 r13725"
   sodipodi:docname="drawing.svg"
   onload="makeDraggable(evt)">
  <g
     inkscape:label="Layer 1"
     inkscape:groupmode="layer"
     id="layer1">
    <path
       style="fill:#447fae;fill-opacity:1"
       d="m 99.23243,101.2138 216.30121,152.95767 0,-152.95767 -216.30121,0 z"
       id="blueTriangle"
       inkscape:connector-curvature="0" />
    <path
       style="fill:#b3c600;fill-opacity:1"
       d="m 99.236545,407.12692 216.301205,-152.95766 0,152.95766 -216.301205,0 z"
       id="rect4780-2"
       inkscape:connector-curvature="0" />
    <ellipse
       style="fill:#7f8184;fill-opacity:1;stroke:none"
       id="path4877"
       cx="190.71228"
       cy="355.38422"
       rx="74"
       ry="70"
       transform="matrix(0.92266592,-0.38560031,0.38560031,0.92266592,0,0)" />
    <ellipse
      class="draggable"
      id="outterCircle"
      cx="340"
      cy="218.36221"
      rx="54"
      ry="51" />
  </g>
</svg>

带有id“外圆”的椭圆是可拖动的,并且可以通过id“ blueTriangle”拖动到路径内。

我想要的是当椭圆在路径内时能够知道它们的坐标。

请问我该怎么做?

0 个答案:

没有答案