This is an automated email from the ASF dual-hosted git repository.
sushuang pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git
commit c34c6785a883ea61c2e43e944527c56cbfe8b3a2
Author: sushuang <sushuang0...@gmail.com>
AuthorDate: Tue May 29 22:42:13 2018 +0800
rename event of roam controller and tweak zoom delta.
---
src/chart/graph/GraphView.js | 18 ++++++------
src/chart/treemap/TreemapView.js | 13 +++++----
src/component/dataZoom/InsideZoomModel.js | 1 +
src/component/dataZoom/InsideZoomView.js | 11 +++----
src/component/dataZoom/roams.js | 39 ++++++++++++++++---------
src/component/helper/MapDraw.js | 18 ++++++------
src/component/helper/RoamController.js | 48 +++++++++++++++++++++++--------
7 files changed, 95 insertions(+), 53 deletions(-)
diff --git a/src/chart/graph/GraphView.js b/src/chart/graph/GraphView.js
index ceb64a5..4605420 100644
--- a/src/chart/graph/GraphView.js
+++ b/src/chart/graph/GraphView.js
@@ -321,23 +321,23 @@ export default echarts.extendChartView({
controller
.off('pan')
.off('zoom')
- .on('pan', function (dx, dy) {
- roamHelper.updateViewOnPan(controllerHost, dx, dy);
+ .on('pan', function (e) {
+ roamHelper.updateViewOnPan(controllerHost, e.dx, e.dy);
api.dispatchAction({
seriesId: seriesModel.id,
type: 'graphRoam',
- dx: dx,
- dy: dy
+ dx: e.dx,
+ dy: e.dy
});
})
- .on('zoom', function (zoom, mouseX, mouseY) {
- roamHelper.updateViewOnZoom(controllerHost, zoom, mouseX,
mouseY);
+ .on('zoom', function (e) {
+ roamHelper.updateViewOnZoom(controllerHost, e.scale,
e.originX, e.originY);
api.dispatchAction({
seriesId: seriesModel.id,
type: 'graphRoam',
- zoom: zoom,
- originX: mouseX,
- originY: mouseY
+ zoom: e.scale,
+ originX: e.originX,
+ originY: e.originY
});
this._updateNodeAndLinkScale();
adjustEdge(seriesModel.getGraph(),
this._getNodeGlobalScale(seriesModel));
diff --git a/src/chart/treemap/TreemapView.js b/src/chart/treemap/TreemapView.js
index 73d5229..bf4b2ce 100644
--- a/src/chart/treemap/TreemapView.js
+++ b/src/chart/treemap/TreemapView.js
@@ -431,9 +431,9 @@ export default echarts.extendChartView({
/**
* @private
*/
- _onPan: function (dx, dy) {
+ _onPan: function (e) {
if (this._state !== 'animating'
- && (Math.abs(dx) > DRAG_THRESHOLD || Math.abs(dy) > DRAG_THRESHOLD)
+ && (Math.abs(e.dx) > DRAG_THRESHOLD || Math.abs(e.dy) >
DRAG_THRESHOLD)
) {
// These param must not be cached.
var root = this.seriesModel.getData().tree.root;
@@ -453,7 +453,7 @@ export default echarts.extendChartView({
from: this.uid,
seriesId: this.seriesModel.id,
rootRect: {
- x: rootLayout.x + dx, y: rootLayout.y + dy,
+ x: rootLayout.x + e.dx, y: rootLayout.y + e.dy,
width: rootLayout.width, height: rootLayout.height
}
});
@@ -463,7 +463,10 @@ export default echarts.extendChartView({
/**
* @private
*/
- _onZoom: function (scale, mouseX, mouseY) {
+ _onZoom: function (e) {
+ var mouseX = e.originX;
+ var mouseY = e.originY;
+
if (this._state !== 'animating') {
// These param must not be cached.
var root = this.seriesModel.getData().tree.root;
@@ -490,7 +493,7 @@ export default echarts.extendChartView({
// Scale root bounding rect.
var m = matrix.create();
matrix.translate(m, m, [-mouseX, -mouseY]);
- matrix.scale(m, m, [scale, scale]);
+ matrix.scale(m, m, [e.scale, e.scale]);
matrix.translate(m, m, [mouseX, mouseY]);
rect.applyTransform(m);
diff --git a/src/component/dataZoom/InsideZoomModel.js
b/src/component/dataZoom/InsideZoomModel.js
index b13782b..2022fd9 100644
--- a/src/component/dataZoom/InsideZoomModel.js
+++ b/src/component/dataZoom/InsideZoomModel.js
@@ -31,6 +31,7 @@ export default DataZoomModel.extend({
zoomLock: false, // Whether disable zoom but only pan.
zoomOnMouseWheel: true, // Can be: true / false / 'shift' / 'ctrl' /
'alt'.
moveOnMouseMove: true, // Can be: true / false / 'shift' / 'ctrl' /
'alt'.
+ moveOnMouseWheel: false, // Can be: true / false / 'shift' / 'ctrl' /
'alt'.
preventDefaultMouseMove: true
}
});
\ No newline at end of file
diff --git a/src/component/dataZoom/InsideZoomView.js
b/src/component/dataZoom/InsideZoomView.js
index edd4e39..91acac4 100644
--- a/src/component/dataZoom/InsideZoomView.js
+++ b/src/component/dataZoom/InsideZoomView.js
@@ -80,6 +80,7 @@ var InsideZoomView = DataZoomView.extend({
roamControllerOpt: {
zoomOnMouseWheel: dataZoomOption.zoomOnMouseWheel,
moveOnMouseMove: dataZoomOption.moveOnMouseMove,
+ moveOnMouseWheel: dataZoomOption.moveOnMouseWheel,
preventDefaultMouseMove:
dataZoomOption.preventDefaultMouseMove
}
}
@@ -101,7 +102,7 @@ var InsideZoomView = DataZoomView.extend({
/**
* @private
*/
- _onPan: function (coordInfo, coordSysName, controller, dx, dy, oldX, oldY,
newX, newY) {
+ _onPan: function (coordInfo, coordSysName, controller, e) {
var lastRange = this._range;
var range = lastRange.slice();
@@ -112,7 +113,7 @@ var InsideZoomView = DataZoomView.extend({
}
var directionInfo = getDirectionInfo[coordSysName](
- [oldX, oldY], [newX, newY], axisModel, controller, coordInfo
+ [e.oldX, e.oldY], [e.newX, e.newY], axisModel, controller,
coordInfo
);
var percentDelta = directionInfo.signal
@@ -131,7 +132,7 @@ var InsideZoomView = DataZoomView.extend({
/**
* @private
*/
- _onZoom: function (coordInfo, coordSysName, controller, scale, mouseX,
mouseY) {
+ _onZoom: function (coordInfo, coordSysName, controller, e) {
var lastRange = this._range;
var range = lastRange.slice();
@@ -142,7 +143,7 @@ var InsideZoomView = DataZoomView.extend({
}
var directionInfo = getDirectionInfo[coordSysName](
- null, [mouseX, mouseY], axisModel, controller, coordInfo
+ null, [e.originX, e.originY], axisModel, controller, coordInfo
);
var percentPoint = (
directionInfo.signal > 0
@@ -150,7 +151,7 @@ var InsideZoomView = DataZoomView.extend({
: (directionInfo.pixel - directionInfo.pixelStart)
) / directionInfo.pixelLength * (range[1] - range[0]) + range[0];
- scale = Math.max(1 / scale, 0);
+ var scale = Math.max(1 / e.scale, 0);
range[0] = (range[0] - percentPoint) * scale + percentPoint;
range[1] = (range[1] - percentPoint) * scale + percentPoint;
diff --git a/src/component/dataZoom/roams.js b/src/component/dataZoom/roams.js
index b2c962c..4b52974 100644
--- a/src/component/dataZoom/roams.js
+++ b/src/component/dataZoom/roams.js
@@ -136,8 +136,15 @@ function giveStore(api) {
function createController(api, newRecord) {
var controller = new RoamController(api.getZr());
- controller.on('pan', curry(onPan, newRecord));
- controller.on('zoom', curry(onZoom, newRecord));
+
+ zrUtil.each(['pan', 'zoom', 'scrollMove'], function (eventName) {
+ controller.on(eventName, function (event) {
+ wrapAndDispatch(newRecord, function (info) {
+ var methodName = eventName + 'GetRange';
+ return info[methodName] &&
info[methodName](newRecord.controller, event);
+ });
+ });
+ });
return controller;
}
@@ -151,17 +158,23 @@ function cleanStore(store) {
});
}
-function onPan(record, dx, dy, oldX, oldY, newX, newY) {
- wrapAndDispatch(record, function (info) {
- return info.panGetRange(record.controller, dx, dy, oldX, oldY, newX,
newY);
- });
-}
-
-function onZoom(record, scale, mouseX, mouseY) {
- wrapAndDispatch(record, function (info) {
- return info.zoomGetRange(record.controller, scale, mouseX, mouseY);
- });
-}
+// function onPan(record, dx, dy, oldX, oldY, newX, newY) {
+// wrapAndDispatch(record, function (info) {
+// return info.panGetRange(record.controller, dx, dy, oldX, oldY,
newX, newY);
+// });
+// }
+
+// function onZoom(record, scale, mouseX, mouseY) {
+// wrapAndDispatch(record, function (info) {
+// return info.zoomGetRange(record.controller, scale, mouseX, mouseY);
+// });
+// }
+
+// function onScrollMove(record, scrollDelta) {
+// wrapAndDispatch(record, function (info) {
+// return info.scrollMoveGetRange(record.controller, scrollDelta);
+// });
+// }
function wrapAndDispatch(record, getRange) {
var batch = [];
diff --git a/src/component/helper/MapDraw.js b/src/component/helper/MapDraw.js
index 9ea90d9..7f74047 100644
--- a/src/component/helper/MapDraw.js
+++ b/src/component/helper/MapDraw.js
@@ -389,26 +389,26 @@ MapDraw.prototype = {
return action;
}
- controller.off('pan').on('pan', function (dx, dy) {
+ controller.off('pan').on('pan', function (e) {
this._mouseDownFlag = false;
- roamHelper.updateViewOnPan(controllerHost, dx, dy);
+ roamHelper.updateViewOnPan(controllerHost, e.dx, e.dy);
api.dispatchAction(zrUtil.extend(makeActionBase(), {
- dx: dx,
- dy: dy
+ dx: e.dx,
+ dy: e.dy
}));
}, this);
- controller.off('zoom').on('zoom', function (zoom, mouseX, mouseY) {
+ controller.off('zoom').on('zoom', function (e) {
this._mouseDownFlag = false;
- roamHelper.updateViewOnZoom(controllerHost, zoom, mouseX, mouseY);
+ roamHelper.updateViewOnZoom(controllerHost, e.scale, e.originX,
e.originY);
api.dispatchAction(zrUtil.extend(makeActionBase(), {
- zoom: zoom,
- originX: mouseX,
- originY: mouseY
+ zoom: e.scale,
+ originX: e.originX,
+ originY: e.originY
}));
if (this._updateGroup) {
diff --git a/src/component/helper/RoamController.js
b/src/component/helper/RoamController.js
index 09d9d89..d0638c8 100644
--- a/src/component/helper/RoamController.js
+++ b/src/component/helper/RoamController.js
@@ -76,6 +76,7 @@ function RoamController(zr) {
* @param {Object} [opt]
* @param {Object} [opt.zoomOnMouseWheel=true]
* @param {Object} [opt.moveOnMouseMove=true]
+ * @param {Object} [opt.moveOnMouseWheel=false]
* @param {Object} [opt.preventDefaultMouseMove=true] When pan.
*/
this.enable = function (controlType, opt) {
@@ -86,6 +87,7 @@ function RoamController(zr) {
this._opt = zrUtil.defaults(zrUtil.clone(opt) || {}, {
zoomOnMouseWheel: true,
moveOnMouseMove: true,
+ moveOnMouseWheel: false,
preventDefaultMouseMove: true
});
@@ -169,7 +171,7 @@ function mousemove(e) {
this._opt.preventDefaultMouseMove && eventTool.stop(e.event);
- this.trigger('pan', dx, dy, oldX, oldY, x, y);
+ this.trigger('pan', {dx: dx, dy: dy, oldX: oldX, oldY: oldY, newX: x,
newY: y});
}
function mouseup(e) {
@@ -179,34 +181,56 @@ function mouseup(e) {
}
function mousewheel(e) {
+ var shouldZoom = checkKeyBinding(this, 'zoomOnMouseWheel', e);
+ var shouldMove = checkKeyBinding(this, 'moveOnMouseWheel', e);
+ var wheelDelta = e.wheelDelta;
+ var absWheelDeltaDelta = Math.abs(wheelDelta);
+
// wheelDelta maybe -0 in chrome mac.
- if (!checkKeyBinding(this, 'zoomOnMouseWheel', e) || e.wheelDelta === 0) {
+ if (wheelDelta === 0 || (!shouldZoom && !shouldMove)) {
return;
}
+ // console.log(wheelDelta);
+ if (shouldZoom) {
+ // Convenience:
+ // Mac and VM Windows on Mac: scroll up: zoom out.
+ // Windows: scroll up: zoom in.
+
+ // FIXME: Should do more test in different environment.
+ // wheelDelta is too complicated in difference nvironment
+ // (https://developer.mozilla.org/en-US/docs/Web/Events/mousewheel),
+ // although it has been normallized by zrender.
+ // wheelDelta of mouse wheel is bigger than touch pad.
+ var factor = absWheelDeltaDelta > 3 ? 1.4 : absWheelDeltaDelta > 1 ?
1.2 : 1.1;
+ var scale = wheelDelta > 0 ? factor : 1 / factor;
+ zoom.call(this, e, scale, e.offsetX, e.offsetY);
+ }
- // Convenience:
- // Mac and VM Windows on Mac: scroll up: zoom out.
- // Windows: scroll up: zoom in.
- var zoomDelta = e.wheelDelta > 0 ? 1.1 : 1 / 1.1;
- zoom.call(this, e, zoomDelta, e.offsetX, e.offsetY);
+ if (shouldMove) {
+ // FIXME: Should do more test in different environment.
+ var absDelta = Math.abs(wheelDelta);
+ // wheelDelta of mouse wheel is bigger than touch pad.
+ var scrollDelta = absDelta > 3 ? 1.4 : absDelta > 1 ? 1.2 : 1.1;
+ this.trigger('scrollMove', {scrollDelta: scrollDelta});
+ }
}
function pinch(e) {
if (interactionMutex.isTaken(this._zr, 'globalPan')) {
return;
}
- var zoomDelta = e.pinchScale > 1 ? 1.1 : 1 / 1.1;
- zoom.call(this, e, zoomDelta, e.pinchX, e.pinchY);
+ var scale = e.pinchScale > 1 ? 1.1 : 1 / 1.1;
+ zoom.call(this, e, scale, e.pinchX, e.pinchY);
}
-function zoom(e, zoomDelta, zoomX, zoomY) {
- if (this.pointerChecker && this.pointerChecker(e, zoomX, zoomY)) {
+function zoom(e, scale, originX, originY) {
+ if (this.pointerChecker && this.pointerChecker(e, originX, originY)) {
// When mouse is out of roamController rect,
// default befavoius should not be be disabled, otherwise
// page sliding is disabled, contrary to expectation.
eventTool.stop(e.event);
- this.trigger('zoom', zoomDelta, zoomX, zoomY);
+ this.trigger('zoom', {scale: scale, originX: originX, originY:
originY});
}
}
--
To stop receiving notification emails like this one, please contact
sushu...@apache.org.
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscr...@echarts.apache.org
For additional commands, e-mail: commits-h...@echarts.apache.org
