From b4044b694e57d41756fd633686515101845223e3 Mon Sep 17 00:00:00 2001
From: Brandon Clayton <bclayton@usgs.gov>
Date: Mon, 16 Sep 2024 13:44:41 -0600
Subject: [PATCH 1/2] add option to drag and roate
---
src/disagg/DisaggGraphView.js | 40 ++++++++++++++----------
styles/_D3View.scss | 5 ++-
types/disagg/DisaggGraphViewOptions.d.ts | 4 +++
3 files changed, 32 insertions(+), 17 deletions(-)
diff --git a/src/disagg/DisaggGraphView.js b/src/disagg/DisaggGraphView.js
index a10f783..25aa383 100644
--- a/src/disagg/DisaggGraphView.js
+++ b/src/disagg/DisaggGraphView.js
@@ -13,7 +13,9 @@ var Collection = require('../mvc/Collection'),
var _DEFAULTS;
-_DEFAULTS = {};
+_DEFAULTS = {
+ allowDrag: true,
+};
var __calculateBounds;
@@ -139,22 +141,28 @@ var DisaggGraphView = function (options) {
y: 0,
};
- d3.select(_this.d33d.el)
- .on('mousedown', event => {
- origin.x = event.clientX;
- origin.y = event.clientY;
- dragging = true;
- })
- .on('mousemove', event => {
- if (dragging) {
- var dx = event.clientX - origin.x;
- var dz = event.clientY - origin.y;
- _this.setOrigin(280 - dx, -150, 180 + dz)
- }
+ if (options.allowDrag) {
+ d3.select(_this.d33d.el)
+ .classed('cursor-move', true)
+ .on('mousedown', event => {
+ origin.x = event.clientX;
+ origin.y = event.clientY;
+ dragging = true;
+ })
+ .on('mousemove', event => {
+ if (dragging) {
+ var dx = event.clientX - origin.x;
+ var dz = event.clientY - origin.y;
+ _this.setOrigin(280 - dx, -150, 180 + dz)
+ }
+ })
+ .on('mouseup', () => {
+ dragging = false
})
- .on('mouseup', () => {
- dragging = false
- })
+ } else {
+ d3.select(_this.d33d.el)
+ .classed('cursor-move', false);
+ }
};
/**
diff --git a/styles/_D3View.scss b/styles/_D3View.scss
index 6dcb806..f15e0d8 100644
--- a/styles/_D3View.scss
+++ b/styles/_D3View.scss
@@ -17,7 +17,6 @@
}
> svg {
- cursor: move;
fill: none;
left: 0;
position: absolute;
@@ -27,6 +26,10 @@
width: 100%;
}
+ .cursor-move {
+ cursor: move;
+ }
+
/* text */
.plot-title,
.tooltip-content > text {
diff --git a/types/disagg/DisaggGraphViewOptions.d.ts b/types/disagg/DisaggGraphViewOptions.d.ts
index 7cdf03b..3d9e236 100644
--- a/types/disagg/DisaggGraphViewOptions.d.ts
+++ b/types/disagg/DisaggGraphViewOptions.d.ts
@@ -3,6 +3,10 @@ import {Disaggregation} from './Disaggregation';
export interface DisaggGraphViewOptions
extends SelectedCollectionViewOptions<Disaggregation> {
+ /**
+ * Whether to allow drag and rotate of graph.
+ */
+ allowDrag?: boolean;
/**
* Default null.
* Plotting bounds.
--
GitLab
From 56302902c01d520f66024f06e36caa691c492605 Mon Sep 17 00:00:00 2001
From: Brandon Clayton <bclayton@usgs.gov>
Date: Mon, 16 Sep 2024 13:48:54 -0600
Subject: [PATCH 2/2] add styling
---
styles/_D33dDisaggBin.scss | 2 ++
styles/_D3View.scss | 2 +-
2 files changed, 3 insertions(+), 1 deletion(-)
diff --git a/styles/_D33dDisaggBin.scss b/styles/_D33dDisaggBin.scss
index c6aefdd..8018d61 100644
--- a/styles/_D33dDisaggBin.scss
+++ b/styles/_D33dDisaggBin.scss
@@ -1,6 +1,8 @@
@import '_GraphVariables.scss';
.D33dDisaggBin {
+ cursor: default;
+
> g {
> path {
stroke: #666;
diff --git a/styles/_D3View.scss b/styles/_D3View.scss
index f15e0d8..ec63081 100644
--- a/styles/_D3View.scss
+++ b/styles/_D3View.scss
@@ -26,7 +26,7 @@
width: 100%;
}
- .cursor-move {
+ &.cursor-move {
cursor: move;
}
--
GitLab