diff --git a/src/app/cartography/shared/tools/moving-tool.ts b/src/app/cartography/shared/tools/moving-tool.ts index 43dd63ad..873f1c56 100644 --- a/src/app/cartography/shared/tools/moving-tool.ts +++ b/src/app/cartography/shared/tools/moving-tool.ts @@ -1,18 +1,22 @@ import {SVGSelection} from "../../../map/models/types"; import {Context} from "../../../map/models/context"; -import {D3ZoomEvent, zoom} from "d3-zoom"; +import {D3ZoomEvent, zoom, ZoomBehavior} from "d3-zoom"; import { event } from "d3-selection"; export class MovingTool { private selection: SVGSelection; private context: Context; + private zoom: ZoomBehavior; + + constructor() { + this.zoom = zoom() + .scaleExtent([1 / 2, 8]); + } public connect(selection: SVGSelection, context: Context) { this.selection = selection; this.context = context; - this.selection.call(zoom() - .scaleExtent([1 / 2, 8]); } public draw(selection: SVGSelection, context: Context) { @@ -32,10 +36,14 @@ export class MovingTool { `${self.context.getSize().height / 2 + e.transform.y}) scale(${e.transform.k})`); }; - this.selection.on('zoom', onZoom); + + this.zoom.on('zoom', onZoom); + this.selection.call(this.zoom); } public deactivate() { - this.selection.on('zoom', null); + // d3.js preserves event `mousedown.zoom` and blocks selection + this.selection.on('mousedown.zoom', null); + this.zoom.on('zoom', null); } } diff --git a/src/app/cartography/shared/tools/selection-tool.ts b/src/app/cartography/shared/tools/selection-tool.ts index 39dc2964..26a9aef4 100644 --- a/src/app/cartography/shared/tools/selection-tool.ts +++ b/src/app/cartography/shared/tools/selection-tool.ts @@ -20,6 +20,7 @@ export class SelectionTool { return [p[0] - transformation_point.x, p[1] - transformation_point.y]; }; + this.selection.on("mousedown", function() { const subject = select(window); const parent = this.parentElement; @@ -53,6 +54,7 @@ export class SelectionTool { .attr("class", "selection") .attr("visibility", "hidden"); } + this.selection = selection; } private startSelection(start) { diff --git a/src/app/project-map/project-map.component.ts b/src/app/project-map/project-map.component.ts index d230fadb..bb453e2f 100644 --- a/src/app/project-map/project-map.component.ts +++ b/src/app/project-map/project-map.component.ts @@ -270,8 +270,8 @@ export class ProjectMapComponent implements OnInit { this.mapChild.graphLayout.getSelectionTool().deactivate(); this.mapChild.graphLayout.getMovingTool().activate(); } else { - this.mapChild.graphLayout.getSelectionTool().activate(); this.mapChild.graphLayout.getMovingTool().deactivate(); + this.mapChild.graphLayout.getSelectionTool().activate(); } }