fixed dragging lines with arrows to display arrowhead

1 files changed, 16 insertions, 0 deletions

diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts
index 421e4c6bb..6fde4b06e 100644
--- a/src/client/util/DragManager.ts
+++ b/src/client/util/DragManager.ts
@@ -365,6 +365,22 @@ export namespace DragManager {
         const dragElements = eles.map(ele => {
             if (!ele.parentNode) dragDiv.appendChild(ele);
             const dragElement = ele.parentNode === dragDiv ? ele : ele.cloneNode(true) as HTMLElement;
+            let children = Array.from(dragElement.children);
+            while (children.length) { // need to replace all the maker node reference ids with new unique ids. otherwise, the clone nodes will reference the original nodes which are all hidden during the drag
+                const next = children.pop();
+                next && children.push(...Array.from(next.children));
+                if (next) {
+                    if (next.localName.startsWith("path") && (next.attributes as any)["marker-start"]) {
+                        next.setAttribute("marker-start", (next.attributes as any)["marker-start"].value.replace("#", "#X"));
+                    }
+                    if (next.localName.startsWith("path") && (next.attributes as any)["marker-end"]) {
+                        next.setAttribute("marker-end", (next.attributes as any)["marker-end"].value.replace("#", "#X"));
+                    }
+                    if (next.localName.startsWith("marker")) {
+                        next.id = "X" + next.id;
+                    }
+                }
+            }
             const rect = ele.getBoundingClientRect();
             const scaleX = rect.width / ele.offsetWidth;
             const scaleY = ele.offsetHeight ? rect.height / ele.offsetHeight : scaleX;