gesture.js 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153
  1. var Hammer = require('hammerjs'); // http://hammerjs.github.io/
  2. var Util = require('../util/common');
  3. var defaultOptions = {
  4. useCalculate: true,
  5. useOffset: false
  6. };
  7. var GestureController =
  8. /*#__PURE__*/
  9. function () {
  10. function GestureController(_ref) {
  11. var dom = _ref.dom,
  12. gesture = _ref.gesture,
  13. options = _ref.options,
  14. chart = _ref.chart,
  15. hammerOptions = _ref.hammerOptions;
  16. this.Hammer = Hammer;
  17. this.hammer = new Hammer(dom, hammerOptions);
  18. this.dom = dom;
  19. this.gesture = gesture;
  20. this.options = Util.deepMix({}, defaultOptions, options);
  21. this.hammerOptions = hammerOptions;
  22. this.chart = chart;
  23. this._unbindEvent = {};
  24. if (!options) {
  25. this.hammerOptionsHack(gesture, this.hammer);
  26. }
  27. }
  28. var _proto = GestureController.prototype;
  29. _proto.hammerOptionsHack = function hammerOptionsHack(gesture, hammer) {
  30. for (var key in gesture) {
  31. if (key.indexOf('swipe') !== -1 && hammer.get('swipe')) {
  32. hammer.get('swipe').set({
  33. enable: true
  34. });
  35. }
  36. if (key.indexOf('pinch') !== -1 && hammer.get('pinch')) {
  37. hammer.get('pinch').set({
  38. enable: true
  39. });
  40. }
  41. }
  42. };
  43. _proto.bindEvents = function bindEvents() {
  44. var _this = this;
  45. var gesture = this.gesture,
  46. hammer = this.hammer,
  47. dom = this.dom;
  48. var useCalculate = this.options.useCalculate;
  49. if (!hammer) {
  50. return;
  51. }
  52. var _loop = function _loop(key) {
  53. if (['touchstart', 'touchmove', 'touchend'].indexOf(key) !== -1) {
  54. var bindEvent = function bindEvent(event) {
  55. var records = useCalculate ? _this.getEventPostionRecords(event, true) : null;
  56. gesture[key](records, event);
  57. };
  58. Util.addEventListener(dom, key, bindEvent);
  59. _this._unbindEvent[key] = bindEvent;
  60. } else {
  61. hammer.on(key, function (event) {
  62. var records = useCalculate ? _this.getEventPostionRecords(event, false) : null;
  63. gesture[key](records, event);
  64. });
  65. }
  66. };
  67. for (var key in gesture) {
  68. _loop(key);
  69. }
  70. };
  71. _proto.getEventPostionRecords = function getEventPostionRecords(event, _isOrigin) {
  72. var useOffset = this.options.useOffset;
  73. var canvasDom = this.chart.get('canvas').get('el');
  74. var x;
  75. var y;
  76. if (_isOrigin) {
  77. var positionSource = event.targetTouches.length > 0 ? event.targetTouches[0] : event.changedTouches[0];
  78. if (useOffset) {
  79. x = positionSource.clientX - canvasDom.offsetLeft;
  80. y = positionSource.clientY - canvasDom.offsetTop;
  81. } else {
  82. x = positionSource.clientX;
  83. y = positionSource.clientY;
  84. }
  85. } else {
  86. if (useOffset) {
  87. x = event.center.x - canvasDom.offsetLeft;
  88. y = event.center.y - canvasDom.offsetTop;
  89. } else {
  90. x = event.center.x;
  91. y = event.center.y;
  92. }
  93. }
  94. return this.chart.getSnapRecords({
  95. x: x,
  96. y: y
  97. });
  98. };
  99. _proto.destroy = function destroy() {
  100. this.hammer.destroy();
  101. for (var key in this._unbindEvent) {
  102. var event = this._unbindEvent[key];
  103. Util.removeEventListener(this.dom, key, event);
  104. }
  105. };
  106. return GestureController;
  107. }();
  108. module.exports = {
  109. init: function init(chart) {
  110. chart.pluginGesture = function (_ref2) {
  111. var gesture = _ref2.gesture,
  112. options = _ref2.options,
  113. hammerOptions = _ref2.hammerOptions;
  114. var canvasDom = chart.get('canvas').get('el');
  115. var gestureController = new GestureController({
  116. dom: canvasDom,
  117. gesture: gesture,
  118. options: options,
  119. hammerOptions: hammerOptions,
  120. chart: chart
  121. });
  122. gestureController.bindEvents();
  123. chart.set('gestureController', gestureController);
  124. return gestureController;
  125. };
  126. },
  127. clear: function clear(chart) {
  128. var gestureController = chart.get('gestureController');
  129. gestureController && gestureController.destroy();
  130. }
  131. };