diff --git a/client/src/components/Workflow/Editor/Node.vue b/client/src/components/Workflow/Editor/Node.vue index 404fd3a84ed..6391975697a 100644 --- a/client/src/components/Workflow/Editor/Node.vue +++ b/client/src/components/Workflow/Editor/Node.vue @@ -88,6 +88,8 @@ import { ActiveOutputs } from "./modules/outputs"; import { attachDragging } from "./modules/dragging"; Vue.use(BootstrapVue); +const OFFSET_RANGE = 100; + export default { components: { LoadingSpan, @@ -162,8 +164,10 @@ export default { const p = document.getElementById("canvas-viewport"); const o = document.getElementById("canvas-container"); if (p && o) { - const left = -o.offsetLeft + (p.offsetWidth - el.offsetWidth) / 2; - const top = -o.offsetTop + (p.offsetHeight - el.offsetHeight) / 2; + const left = + -o.offsetLeft + (p.offsetWidth - el.offsetWidth) / 2 + this.offsetVaryPosition(OFFSET_RANGE); + const top = + -o.offsetTop + (p.offsetHeight - el.offsetHeight) / 2 + this.offsetVaryPosition(OFFSET_RANGE); el.style.top = `${top}px`; el.style.left = `${left}px`; } @@ -344,6 +348,9 @@ export default { // Remove active class element.classList.remove("node-active"); }, + offsetVaryPosition(offsetRange) { + return Math.floor(Math.random() * offsetRange); + }, }, };