diff --git a/src/app/pages/home/home-page.component.html b/src/app/pages/home/home-page.component.html index 08d7231..1832434 100644 --- a/src/app/pages/home/home-page.component.html +++ b/src/app/pages/home/home-page.component.html @@ -26,7 +26,7 @@ - + {{node.id}} diff --git a/src/app/pages/home/home-page.component.ts b/src/app/pages/home/home-page.component.ts index 98afbf2..ec1ee0c 100644 --- a/src/app/pages/home/home-page.component.ts +++ b/src/app/pages/home/home-page.component.ts @@ -165,6 +165,35 @@ export class HomePageComponent implements OnInit, OnDestroy { simulationRestart() { // Update and restart the simulation. + const __this = this; + + function started(node: Node) { + /** Preventing propagation of dragstart to parent elements */ + d3.event.sourceEvent.stopPropagation(); + + if (!d3.event.active) { + __this.simulation.alphaTarget(0.3).restart(); + } + + d3.event.on('drag', dragged).on('end', ended); + + function dragged() { + node.fx = d3.event.x; + node.fy = d3.event.y; + } + + function ended() { + if (!d3.event.active) { + __this.simulation.alphaTarget(0); + } + + node.fx = null; + node.fy = null; + } + } + + d3.select(this.discoveryTargetRef.nativeElement).selectAll('.node-container').call(d3.drag().on('start', started)); + this.simulation .nodes(this.nodes) .force('link', d3.forceLink(this.links).distance(150))