InsideZoomView.js 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193
  1. var zrUtil = require("zrender/lib/core/util");
  2. var DataZoomView = require("./DataZoomView");
  3. var sliderMove = require("../helper/sliderMove");
  4. var roams = require("./roams");
  5. var bind = zrUtil.bind;
  6. var InsideZoomView = DataZoomView.extend({
  7. type: 'dataZoom.inside',
  8. /**
  9. * @override
  10. */
  11. init: function (ecModel, api) {
  12. /**
  13. * 'throttle' is used in this.dispatchAction, so we save range
  14. * to avoid missing some 'pan' info.
  15. * @private
  16. * @type {Array.<number>}
  17. */
  18. this._range;
  19. },
  20. /**
  21. * @override
  22. */
  23. render: function (dataZoomModel, ecModel, api, payload) {
  24. InsideZoomView.superApply(this, 'render', arguments); // Notice: origin this._range should be maintained, and should not be re-fetched
  25. // from dataZoomModel when payload.type is 'dataZoom', otherwise 'pan' or 'zoom'
  26. // info will be missed because of 'throttle' of this.dispatchAction.
  27. if (roams.shouldRecordRange(payload, dataZoomModel.id)) {
  28. this._range = dataZoomModel.getPercentRange();
  29. } // Reset controllers.
  30. zrUtil.each(this.getTargetCoordInfo(), function (coordInfoList, coordSysName) {
  31. var allCoordIds = zrUtil.map(coordInfoList, function (coordInfo) {
  32. return roams.generateCoordId(coordInfo.model);
  33. });
  34. zrUtil.each(coordInfoList, function (coordInfo) {
  35. var coordModel = coordInfo.model;
  36. var dataZoomOption = dataZoomModel.option;
  37. roams.register(api, {
  38. coordId: roams.generateCoordId(coordModel),
  39. allCoordIds: allCoordIds,
  40. containsPoint: function (e, x, y) {
  41. return coordModel.coordinateSystem.containPoint([x, y]);
  42. },
  43. dataZoomId: dataZoomModel.id,
  44. throttleRate: dataZoomModel.get('throttle', true),
  45. panGetRange: bind(this._onPan, this, coordInfo, coordSysName),
  46. zoomGetRange: bind(this._onZoom, this, coordInfo, coordSysName),
  47. zoomLock: dataZoomOption.zoomLock,
  48. disabled: dataZoomOption.disabled,
  49. roamControllerOpt: {
  50. zoomOnMouseWheel: dataZoomOption.zoomOnMouseWheel,
  51. moveOnMouseMove: dataZoomOption.moveOnMouseMove,
  52. preventDefaultMouseMove: dataZoomOption.preventDefaultMouseMove
  53. }
  54. });
  55. }, this);
  56. }, this);
  57. },
  58. /**
  59. * @override
  60. */
  61. dispose: function () {
  62. roams.unregister(this.api, this.dataZoomModel.id);
  63. InsideZoomView.superApply(this, 'dispose', arguments);
  64. this._range = null;
  65. },
  66. /**
  67. * @private
  68. */
  69. _onPan: function (coordInfo, coordSysName, controller, dx, dy, oldX, oldY, newX, newY) {
  70. var range = this._range.slice(); // Calculate transform by the first axis.
  71. var axisModel = coordInfo.axisModels[0];
  72. if (!axisModel) {
  73. return;
  74. }
  75. var directionInfo = getDirectionInfo[coordSysName]([oldX, oldY], [newX, newY], axisModel, controller, coordInfo);
  76. var percentDelta = directionInfo.signal * (range[1] - range[0]) * directionInfo.pixel / directionInfo.pixelLength;
  77. sliderMove(percentDelta, range, [0, 100], 'all');
  78. return this._range = range;
  79. },
  80. /**
  81. * @private
  82. */
  83. _onZoom: function (coordInfo, coordSysName, controller, scale, mouseX, mouseY) {
  84. var range = this._range.slice(); // Calculate transform by the first axis.
  85. var axisModel = coordInfo.axisModels[0];
  86. if (!axisModel) {
  87. return;
  88. }
  89. var directionInfo = getDirectionInfo[coordSysName](null, [mouseX, mouseY], axisModel, controller, coordInfo);
  90. var percentPoint = (directionInfo.signal > 0 ? directionInfo.pixelStart + directionInfo.pixelLength - directionInfo.pixel : directionInfo.pixel - directionInfo.pixelStart) / directionInfo.pixelLength * (range[1] - range[0]) + range[0];
  91. scale = Math.max(1 / scale, 0);
  92. range[0] = (range[0] - percentPoint) * scale + percentPoint;
  93. range[1] = (range[1] - percentPoint) * scale + percentPoint; // Restrict range.
  94. var minMaxSpan = this.dataZoomModel.findRepresentativeAxisProxy().getMinMaxSpan();
  95. sliderMove(0, range, [0, 100], 0, minMaxSpan.minSpan, minMaxSpan.maxSpan);
  96. return this._range = range;
  97. }
  98. });
  99. var getDirectionInfo = {
  100. grid: function (oldPoint, newPoint, axisModel, controller, coordInfo) {
  101. var axis = axisModel.axis;
  102. var ret = {};
  103. var rect = coordInfo.model.coordinateSystem.getRect();
  104. oldPoint = oldPoint || [0, 0];
  105. if (axis.dim === 'x') {
  106. ret.pixel = newPoint[0] - oldPoint[0];
  107. ret.pixelLength = rect.width;
  108. ret.pixelStart = rect.x;
  109. ret.signal = axis.inverse ? 1 : -1;
  110. } else {
  111. // axis.dim === 'y'
  112. ret.pixel = newPoint[1] - oldPoint[1];
  113. ret.pixelLength = rect.height;
  114. ret.pixelStart = rect.y;
  115. ret.signal = axis.inverse ? -1 : 1;
  116. }
  117. return ret;
  118. },
  119. polar: function (oldPoint, newPoint, axisModel, controller, coordInfo) {
  120. var axis = axisModel.axis;
  121. var ret = {};
  122. var polar = coordInfo.model.coordinateSystem;
  123. var radiusExtent = polar.getRadiusAxis().getExtent();
  124. var angleExtent = polar.getAngleAxis().getExtent();
  125. oldPoint = oldPoint ? polar.pointToCoord(oldPoint) : [0, 0];
  126. newPoint = polar.pointToCoord(newPoint);
  127. if (axisModel.mainType === 'radiusAxis') {
  128. ret.pixel = newPoint[0] - oldPoint[0]; // ret.pixelLength = Math.abs(radiusExtent[1] - radiusExtent[0]);
  129. // ret.pixelStart = Math.min(radiusExtent[0], radiusExtent[1]);
  130. ret.pixelLength = radiusExtent[1] - radiusExtent[0];
  131. ret.pixelStart = radiusExtent[0];
  132. ret.signal = axis.inverse ? 1 : -1;
  133. } else {
  134. // 'angleAxis'
  135. ret.pixel = newPoint[1] - oldPoint[1]; // ret.pixelLength = Math.abs(angleExtent[1] - angleExtent[0]);
  136. // ret.pixelStart = Math.min(angleExtent[0], angleExtent[1]);
  137. ret.pixelLength = angleExtent[1] - angleExtent[0];
  138. ret.pixelStart = angleExtent[0];
  139. ret.signal = axis.inverse ? -1 : 1;
  140. }
  141. return ret;
  142. },
  143. singleAxis: function (oldPoint, newPoint, axisModel, controller, coordInfo) {
  144. var axis = axisModel.axis;
  145. var rect = coordInfo.model.coordinateSystem.getRect();
  146. var ret = {};
  147. oldPoint = oldPoint || [0, 0];
  148. if (axis.orient === 'horizontal') {
  149. ret.pixel = newPoint[0] - oldPoint[0];
  150. ret.pixelLength = rect.width;
  151. ret.pixelStart = rect.x;
  152. ret.signal = axis.inverse ? 1 : -1;
  153. } else {
  154. // 'vertical'
  155. ret.pixel = newPoint[1] - oldPoint[1];
  156. ret.pixelLength = rect.height;
  157. ret.pixelStart = rect.y;
  158. ret.signal = axis.inverse ? -1 : 1;
  159. }
  160. return ret;
  161. }
  162. };
  163. var _default = InsideZoomView;
  164. module.exports = _default;