feat(interaction): tooltip 支持移动端

antvis · Apr 2, 2020 · 8e6cddf · 8e6cddf
1 parent 4a86b08
commit 8e6cddf
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 7 deletions.
diff --git a/src/chart/chart.ts b/src/chart/chart.ts
@@ -40,7 +40,7 @@ export default class Chart extends View {
       pixelRatio,
       localRefresh = true,
       visible = true,
-      defaultInteractions = ['tooltip', 'legend-filter', 'legend-active','continuous-filter'],
+      defaultInteractions = [ 'tooltip', 'legend-filter', 'legend-active', 'continuous-filter' ],
       options,
       limitInPlot,
       theme,

diff --git a/src/index.ts b/src/index.ts
@@ -266,8 +266,14 @@ function isPointInView(context: IInteractionContext) {
 
 // 注册 tooltip 的 interaction
 registerInteraction('tooltip', {
-  start: [{ trigger: 'plot:mousemove', action: 'tooltip:show', throttle: { wait: 50, leading: true, trailing: false } }],
-  end: [{ trigger: 'plot:mouseleave', action: 'tooltip:hide' }],
+  start: [
+    { trigger: 'plot:mousemove', action: 'tooltip:show', throttle: { wait: 50, leading: true, trailing: false } },
+    { trigger: 'plot:touchmove', action: 'tooltip:show', throttle: { wait: 50, leading: true, trailing: false } },
+  ],
+  end: [
+    { trigger: 'plot:mouseleave', action: 'tooltip:hide' },
+    { trigger: 'plot:touchend', action: 'tooltip:hide' }
+  ],
 });
 
 // 移动到 elment 上 active
@@ -488,8 +494,7 @@ registerInteraction('legend-filter', {
     { trigger: 'legend-item:mouseleave', action: 'cursor:default' },
   ],
   start: [
-    { trigger: 'legend-item:click', action: 'list-unchecked:toggle' },
-    { trigger: 'legend-item:click', action: 'data-filter:filter' },
+    { trigger: 'legend-item:click', action: [ 'list-unchecked:toggle', 'data-filter:filter' ]  },
   ],
 });
 
@@ -509,8 +514,7 @@ registerInteraction('legend-visible-filter', {
     { trigger: 'legend-item:mouseleave', action: 'cursor:default' },
   ],
   start: [
-    { trigger: 'legend-item:click', action: 'list-unchecked:toggle' },
-    { trigger: 'legend-item:click', action: 'element-filter:filter' },
+    { trigger: 'legend-item:click', action: ['list-unchecked:toggle', 'element-filter:filter'] },
   ],
 });