diff --git a/package/src/components/Nodes/NodeWrapper.vue b/package/src/components/Nodes/NodeWrapper.vue index 4d2159d9..236a187e 100644 --- a/package/src/components/Nodes/NodeWrapper.vue +++ b/package/src/components/Nodes/NodeWrapper.vue @@ -57,12 +57,18 @@ onMounted(() => { }) watch( - [() => node.value.position, () => store.getNode(node.value.parentNode!)], + [ + () => node.value.position, + () => store.getNode(node.value.parentNode!)?.computedPosition, + () => node.value.selected, + () => store.getNode(node.value.parentNode!)?.selected, + ], ([pos, parent]) => { const xyzPos = { ...pos, - z: node.value.dragging || node.value.selected ? 1000 : node.value.computedPosition.z, + z: node.value.dragging || node.value.selected ? 1000 : 0, } + if (parent) { node.value.computedPosition = getXYZPos(parent, xyzPos) } else { diff --git a/package/src/utils/graph.ts b/package/src/utils/graph.ts index 29fb9709..9b988b24 100644 --- a/package/src/utils/graph.ts +++ b/package/src/utils/graph.ts @@ -339,11 +339,11 @@ export const getTransformForBounds = ( return [x, y, clampedZoom] } -export const getXYZPos = (parentNode: GraphNode, computedPosition: XYZPosition): XYZPosition => { +export const getXYZPos = (parentPos: XYZPosition, computedPosition: XYZPosition): XYZPosition => { return { - x: computedPosition.x + parentNode.computedPosition.x, - y: computedPosition.y + parentNode.computedPosition.y, - z: parentNode.computedPosition.z > computedPosition.z ? parentNode.computedPosition.z : computedPosition.z, + x: computedPosition.x + parentPos.x, + y: computedPosition.y + parentPos.y, + z: parentPos.z > computedPosition.z ? parentPos.z : computedPosition.z, } }