Merge pull request #136 from ElemeFE/1226-add-line-tooltip-formatter

feat(line): add tooltipFormatter settings
ElemeFE · Dec 27, 2017 · 6ca50f2 · 6ca50f2
2 parents ed80cc8 + 1370541
commit 6ca50f2
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 5 deletions.
diff --git a/examples/pages/test.vue b/examples/pages/test.vue
@@ -3,6 +3,7 @@
     <ve-line
       :data="chartData"
       ref="chart"
+      :tooltipFormatter="tooltipFormatter"
       :settings="chartSettings"
       :width-change-delay="1500"
       :after-config="afterConfig">
@@ -39,6 +40,10 @@ export default {
     afterConfig (options) {
       // console.log(options)
       return options
+    },
+    tooltipFormatter () {
+      console.log(arguments)
+      return 1
     }
   },
 

diff --git a/src/core.js b/src/core.js
@@ -66,7 +66,8 @@ export default {
     dataEmpty: Boolean,
     extend: Object,
     judgeWidth: { type: Boolean, default: true },
-    widthChangeDelay: { type: Number, default: 300 }
+    widthChangeDelay: { type: Number, default: 300 },
+    tooltipFormatter: { type: Function }
   },
 
   watch: {
@@ -115,7 +116,8 @@ export default {
         tooltipVisible: this.tooltipVisible,
         legendVisible: this.legendVisible,
         echarts: this.echarts,
-        color: this.chartColor
+        color: this.chartColor,
+        tooltipFormatter: this.tooltipFormatter
       }
       if (this.beforeConfig) data = this.beforeConfig(data)
 

diff --git a/src/packages/line/main.js b/src/packages/line/main.js
@@ -112,7 +112,7 @@ function getLineYAxis (args) {
 }
 
 function getLineTooltip (args) {
-  const { axisSite, yAxisType, digit, labelMap, xAxisType } = args
+  const { axisSite, yAxisType, digit, labelMap, xAxisType, tooltipFormatter } = args
   const rightItems = axisSite.right || []
   const rightList = labelMap
     ? rightItems.map(item => {
@@ -122,6 +122,9 @@ function getLineTooltip (args) {
   return {
     trigger: 'axis',
     formatter (items) {
+      if (tooltipFormatter) {
+        return tooltipFormatter.apply(null, arguments)
+      }
       let tpl = []
       const { name, axisValueLabel } = items[0]
       const title = name || axisValueLabel
@@ -181,7 +184,7 @@ export const line = (columns, rows, settings, extra) => {
     lineStyle,
     areaStyle
   } = settings
-  const { tooltipVisible, legendVisible } = extra
+  const { tooltipVisible, legendVisible, tooltipFormatter } = extra
   let metrics = columns.slice()
 
   if (axisSite.left && axisSite.right) {
@@ -200,7 +203,8 @@ export const line = (columns, rows, settings, extra) => {
     yAxisType,
     digit,
     labelMap,
-    xAxisType
+    xAxisType,
+    tooltipFormatter
   })
   const xAxis = getLineXAxis({
     dimension,