Клонирование группы SVG - PullRequest
       10

Клонирование группы SVG

3 голосов
/ 05 октября 2011

У меня есть группа SVG, которая содержит некоторые элементы, я хочу клонировать группу, проблема заключается в том, что функция клонирует только один элемент группы. Вот функция

 <script type="text/ecmascript"><![CDATA[
    function clone(evt) {
        var cloneElement = evt.target.cloneNode(false);
        var newx = 100;
        var newy = 500;
        cloneElement.setAttributeNS(null,"x",newx);
        cloneElement.setAttributeNS(null,"y",newy);
        document.getElementById("layer1").appendChild(cloneElement);
    }

]]></script>

svg выглядит как

<g id="layer1" onclick="clone(evt)">
<rect>
<path>
<circle>
<circle>
</g>

Прямоугольник похож на контейнер, и в результате функция клонирует прямоугольник и оставляет другие элементы. Так что не так?

1 Ответ

10 голосов
/ 05 октября 2011

Две вещи:

  • cloneNode должно быть передано true, если вы хотите глубоко клонированное дерево, иначе оно просто клонирует один элемент
  • evt.target всегда будет элементом, из которого произошло событие, и g-элементы никогда не попадут напрямую, события мыши просто всплывают от дочерних элементов. Вместо этого вы можете использовать evt.currentTarget, если вам нужен элемент, который в данный момент обрабатывает событие (в вашем случае это будет элемент g).
...