重构tooltip formatter回调参数，[]改{}，披露更多信息

doc/example/bar10.html

@@ -50,10 +50,10 @@ option = {
         axisPointer : {            // 坐标轴指示器，坐标轴触发有效
             type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
         },
-        formatter: function (param){
-            return param[0][1] + '<br/>'
-                   + param[0][0] + ' : ' + param[0][2] + '<br/>'
-                   + param[1][0] + ' : ' + (param[1][2] + param[0][2]);
+        formatter: function (params){
+            return params[0].name + '<br/>'
+                   + params[0].seriesName + ' : ' + params[0].value + '<br/>'
+                   + params[1].seriesName + ' : ' + (params[1].value + params[0].value);
         }
     },
     legend: {

doc/example/bar13.html

@@ -53,10 +53,10 @@ option = {
                 width : 1
             }
         },
-        formatter : function (value) {
-            return value[0] + ' : [ '
-               + value[2][0] + ', ' 
-               + value[2][1] + ' ]';
+        formatter : function (params) {
+            return params.seriesName + ' : [ '
+                   + params.value[0] + ', ' 
+                   + params.value[1] + ' ]';
         }
     },
     legend: {

doc/example/bar6.html

@@ -52,13 +52,13 @@ option = {
         },
         formatter: function (params) {
             var tar;
-            if (params[1][2] != '-') {
+            if (params[1].value != '-') {
                 tar = params[1];
             }
             else {
-                tar = params[2];
+                tar = params[0];
             }
-            return tar[1] + '<br/>' + tar[0] + ' : ' + tar[2];
+            return tar.name + '<br/>' + tar.seriesName + ' : ' + tar.value;
         }
     },
     legend: {

doc/example/bar7.html

@@ -51,14 +51,8 @@ option = {
             type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
         },
         formatter: function (params) {
-            var tar;
-            if (params[1][2] != '-') {
-                tar = params[1];
-            }
-            else {
-                tar = params[2];
-            }
-            return tar[1] + '<br/>' + tar[0] + ' : ' + tar[2];
+            var tar = params[0];
+            return tar.name + '<br/>' + tar.seriesName + ' : ' + tar.value;
         }
     },
     toolbox: {

doc/example/chord.html

@@ -46,10 +46,10 @@ option = {
     tooltip : {
         trigger: 'item',
         formatter: function (params) {
-            if (params[4]) { // is edge
-                return params[2].weight;
+            if (params.indicator2) { // is edge
+                return params.value.weight;
             } else {// is node
-                return params[1]
+                return params.name
             }
         }
     },

doc/example/chord1.html

@@ -49,10 +49,10 @@ option = {
     tooltip : {
         trigger: 'item',
         formatter: function (params) {
-            if (params[4]) { // is edge
-                return params[2].weight;
+            if (params.indicator2) { // is edge
+                return params.value.weight;
             } else {// is node
-                return params[1]
+                return params.name
             }
         }
     },

doc/example/chord2.html

@@ -64,19 +64,11 @@ option = {
     tooltip : {
         trigger: 'item',
         formatter : function (params) {
-            var g1 = params[1];
-            var serie = params[0];
-            var g2 = params[3];
-            var data = params[2];
-            var data2 = params[4];
-            if (data2) {
-                if (data > data2) {
-                    return [g1, serie, g2].join(' ');
-                } else {
-                    return [g2, serie, g1].join(' ');
-                }
-            } else {
-                return g1
+            if (params.name && params.name.indexOf('-') != -1) {
+                return params.name.replace('-', ' ' + params.seriesName + ' ')
+            }
+            else {
+                return params.name ? params.name : params.data.id
             }
         }
     },

doc/example/chord3.html

@@ -48,10 +48,10 @@ option = {
     tooltip : {
         trigger: 'item',
         formatter: function (params) {
-            if (params[4]) {    // is edge
-                return params[4] + params[1] + params[3];
+            if (params.indicator2) {    // is edge
+                return params.indicator2 + ' ' + params.name + ' ' + params.indicator;
             } else {    // is node
-                return params[1]
+                return params.name
             }
         }
     },

doc/example/chord4.html

@@ -48,10 +48,10 @@ option = {
     tooltip : {
         trigger: 'item',
         formatter: function (params) {
-            if (params[4]) {    // is edge
-                return params[4] + params[1] + params[3];
+            if (params.indicator2) {    // is edge
+                return params.indicator2 + ' ' + params.name + ' ' + params.indicator;
             } else {    // is node
-                return params[1]
+                return params.name
             }
         }
     },

doc/example/k.html

@@ -43,9 +43,9 @@ option = {
     tooltip : {
         trigger: 'axis',
         formatter: function (params) {
-            var res = params[0][0] + ' ' + params[0][1];
-            res += '<br/>  开盘 : ' + params[0][2][0] + '  最高 : ' + params[0][2][3];
-            res += '<br/>  收盘 : ' + params[0][2][1] + '  最低 : ' + params[0][2][2];
+            var res = params[0].seriesName + ' ' + params[0].name;
+            res += '<br/>  开盘 : ' + params[0].value[0] + '  最高 : ' + params[0].value[3];
+            res += '<br/>  收盘 : ' + params[0].value[1] + '  最低 : ' + params[0].value[2];
             return res;
         }
     },

doc/example/k1.html

@@ -46,9 +46,9 @@ option = {
     tooltip : {
         trigger: 'axis',
         formatter: function (params) {
-            var res = params[0][0] + ' ' + params[0][1];
-            res += '<br/>  开盘 : ' + params[0][2][0] + '  最高 : ' + params[0][2][3];
-            res += '<br/>  收盘 : ' + params[0][2][1] + '  最低 : ' + params[0][2][2];
+            var res = params[0].seriesName + ' ' + params[0].name;
+            res += '<br/>  开盘 : ' + params[0].value[0] + '  最高 : ' + params[0].value[3];
+            res += '<br/>  收盘 : ' + params[0].value[1] + '  最低 : ' + params[0].value[2];
             return res;
         }
     },

doc/example/line6.html

@@ -47,10 +47,10 @@ option = {
     },
     tooltip : {
         trigger: 'axis',
-        formatter: function(v) {
-            return v[0][1] + '<br/>'
-                   + v[0][0] + ' : ' + v[0][2] + ' (m^3/s)<br/>'
-                   + v[1][0] + ' : ' + -v[1][2] + ' (mm)';
+        formatter: function(params) {
+            return params[0].name + '<br/>'
+                   + params[0].seriesName + ' : ' + params[0].value + ' (m^3/s)<br/>'
+                   + params[1].seriesName + ' : ' + -params[1].value + ' (mm)';
         }
     },
     legend: {

doc/example/line7.html

@@ -53,10 +53,10 @@ option = {
                 width : 1
             }
         },
-        formatter : function (value) {
-            return value[0] + ' : [ '
-               + value[2][0] + ', ' 
-               + value[2][1] + ' ]';
+        formatter : function (params) {
+            return params.seriesName + ' : [ '
+                   + params.value[0] + ', ' 
+                   + params.value[1] + ' ]';
         }
     },
     legend: {

doc/example/map10.html

@@ -53,9 +53,7 @@ option = {
     },
     tooltip : {
         trigger: 'item',
-        formatter: function (v) {
-            return v[1];
-        }
+        formatter: '{b}'
     },
     legend: {
         orient: 'vertical',

doc/example/map11.html

@@ -58,9 +58,7 @@ option = {
     },
     tooltip : {
         trigger: 'item',
-        formatter: function (v) {
-            return v[1].replace(':', ' > ');
-        }
+        formatter: '{b}'
     },
     legend: {
         orient: 'vertical',

doc/example/map12.html

@@ -83,9 +83,7 @@ option = {
     },
     tooltip : {
         trigger: 'item',
-        formatter: function (v) {
-            return v[1].replace(':', ' > ');
-        }
+        formatter: '{b}'
     },
     legend: {
         orient: 'vertical',

doc/example/map13.html

@@ -60,11 +60,9 @@ option = {
     },
     tooltip : {
         trigger: 'item',
-        formatter: function (a){
-            var sName = a[0];
-            var pName = a[1];
-            var value = a[2] + '万人次 （' + (a[2]/98.19).toFixed(2) + '%）';
-            return sName + '<br/>' + pName + ' : ' + value;
+        formatter: function (params){
+            var value = params.value + '万人次 （' + (params.value/98.19).toFixed(2) + '%）';
+            return params.seriesName + '<br/>' + params.name + ' : ' + value;
         }
     },
     toolbox: {

doc/example/map18.html

@@ -67,9 +67,7 @@ option = {
     },
     tooltip : {
         trigger: 'item',
-        formatter: function(v) {
-            return v[1];
-        }
+        formatter: '{b}'
     },
     color: ['rgba(218, 70, 214, 1)', 'rgba(100, 149, 237, 1)', 'green'],
     legend: {

doc/example/map4.html

@@ -55,13 +55,11 @@ option = {
     },
     tooltip : {
         trigger: 'item',
-        formatter : function (a) {
-            var sName = a[0];
-            var pName = a[1];
-            var value = (a[2] + '').split('.');
+        formatter : function (params) {
+            var value = (params.value + '').split('.');
             value = value[0].replace(/(\d{1,3})(?=(?:\d{3})+(?!\d))/g, '$1,')
                     + '.' + value[1];
-            return sName + '<br/>' + pName + ' : ' + value;
+            return params.seriesName + '<br/>' + params.name + ' : ' + value;
         }
     },
     toolbox: {

doc/example/map7.html

@@ -82,12 +82,10 @@ option = {
         trigger: 'item',
         showDelay: 0,
         transitionDuration: 0.2,
-        formatter : function (a) {
-            var sName = a[0];
-            var pName = a[1];
-            var value = a[2] + '';
-            value = value.replace(/(\d{1,3})(?=(?:\d{3})+(?!\d))/g, '$1,');
-            return sName + '<br/>' + pName + ' : ' + value;
+        formatter : function (params) {
+            var value = (params.value + '').split('.');
+            value = value[0].replace(/(\d{1,3})(?=(?:\d{3})+(?!\d))/g, '$1,');
+            return params.seriesName + '<br/>' + params.name + ' : ' + value;
         }
     },
     dataRange: {

doc/example/map8.html

@@ -64,11 +64,10 @@ option = {
         trigger: 'item',
         showDelay: 0,
         transitionDuration: 0.2,
-        formatter : function (a) {
-            var sName = a[0];
-            var value = a[2] + '';
+        formatter : function (params) {
+            var value = params.value + '';
             value = value.replace(/(\d{1,3})(?=(?:\d{3})+(?!\d))/g, '$1,');
-            return sName + '<br/>' + value + ' Billion';
+            return params.seriesName + '<br/>' + value + ' Billion';
         }
     },
     toolbox: {

doc/example/mix10.html

@@ -46,12 +46,18 @@ option = {
     tooltip : {
         trigger: 'axis',
         formatter: function (params) {
-            var res = params[1][1];
-            res += '<br/>' + params[1][0];
-            res += '<br/>  开盘 : ' + params[1][2][0] + '  最高 : ' + params[1][2][3];
-            res += '<br/>  收盘 : ' + params[1][2][1] + '  最低 : ' + params[1][2][2];
-            res += '<br/>' + params[0][0];
-            res += ' : ' + params[0][2];
+            var res = params[0].name;
+            for (var i = params.length - 1; i >= 0; i--) {
+                if (params[i].value instanceof Array) {
+                    res += '<br/>' + params[i].seriesName;
+                    res += '<br/>  开盘 : ' + params[i].value[0] + '  最高 : ' + params[i].value[3];
+                    res += '<br/>  收盘 : ' + params[i].value[1] + '  最低 : ' + params[i].value[2];
+                }
+                else {
+                    res += '<br/>' + params[i].seriesName;
+                    res += ' : ' + params[i].value;
+                }
+            }
             return res;
         }
     },

doc/example/mix4.html

@@ -96,11 +96,11 @@ option = {
             type:'scatter',
             tooltip : {
                 trigger: 'item',
-                formatter : function (value) {
-                    return '2013-03-' + value[2][0] + '<br/>'
-                           + value[0] + ' : ' 
-                           + value[2][1] + ', ' 
-                           + value[2][2]; 
+                formatter : function (params) {
+                    return '2013-03-' + params.value[0] + '<br/>'
+                           + params.seriesName + ' : ' 
+                           + params.value[1] + ', ' 
+                           + params.value[2]; 
                 }
             },
             yAxisIndex:1,

doc/example/mix6.html

@@ -46,12 +46,12 @@ option = {
     },
     tooltip : {
         trigger: 'axis',
-        formatter: function (v){
-            return v[0][1] + ' : '
-                   + (v[0][2] - v[1][2] > 0 ? '+' : '-') 
-                   + v[3][2] + '<br/>'
-                   + v[0][0] + ' : ' + v[0][2] + '<br/>'
-                   + v[1][0] + ' : ' + v[1][2] + '<br/>'
+        formatter: function (params){
+            return params[0].name + ' : '
+                   + (params[2].value - params[1].value > 0 ? '+' : '-') 
+                   + params[0].value + '<br/>'
+                   + params[2].seriesName + ' : ' + params[2].value + '<br/>'
+                   + params[3].seriesName + ' : ' + params[3].value + '<br/>'
         }
     },
     toolbox: {

doc/example/mix8.html

@@ -73,10 +73,10 @@ option = {
         trigger: 'axis',
         showDelay: 0,             // 显示延迟，添加显示延迟可以避免频繁切换，单位ms
         formatter: function (params) {
-            var res = params[0][1];
-            res += '<br/>' + params[0][0];
-            res += '<br/>  开盘 : ' + params[0][2][0] + '  最高 : ' + params[0][2][3];
-            res += '<br/>  收盘 : ' + params[0][2][1] + '  最低 : ' + params[0][2][2];
+            var res = params[0].name;
+            res += '<br/>' + params[0].seriesName;
+            res += '<br/>  开盘 : ' + params[0].value[0] + '  最高 : ' + params[0].value[3];
+            res += '<br/>  收盘 : ' + params[0].value[1] + '  最低 : ' + params[0].value[2];
             return res;
         }
     },
@@ -459,7 +459,8 @@ setTimeout(function (){
                 <div id="main3" class="main" style='height:105px;padding-top:1px;border-top-width:0'></div>
                 <div>
                     <button type="button" class="btn btn-sm btn-success" onclick="refresh(true)">刷 新</button>
-                    
+                    <span class="text-primary">切换主题</span>
+                    <select id="theme-select"></select>
 
                     <span id='wrong-message' style="color:red"></span>
                 </div>

doc/example/scatter1.html

@@ -96,16 +96,16 @@ option = {
             type:'scatter',
             tooltip : {
                 trigger: 'item',
-                formatter : function (value) {
-                    if (value[2].length > 1) {
-                        return value[0] + ' :<br/>'
-                           + value[2][0] + 'cm ' 
-                           + value[2][1] + 'kg ';
+                formatter : function (params) {
+                    if (params.value.length > 1) {
+                        return params.seriesName + ' :<br/>'
+                           + params.value[0] + 'cm ' 
+                           + params.value[1] + 'kg ';
                     }
                     else {
-                        return value[0] + ' :<br/>'
-                           + value[1] + ' : '
-                           + value[2] + 'kg ';
+                        return params.seriesName + ' :<br/>'
+                           + params.name + ' : '
+                           + params.value + 'kg ';
                     }
                 }
             },
@@ -179,16 +179,16 @@ option = {
             type:'scatter',
             tooltip : {
                 trigger: 'item',
-                formatter : function (value) {
-                    if (value[2].length > 1) {
-                        return value[0] + ' :<br/>'
-                           + value[2][0] + 'cm ' 
-                           + value[2][1] + 'kg ';
+                formatter : function (params) {
+                    if (params.value.length > 1) {
+                        return params.seriesName + ' :<br/>'
+                           + params.value[0] + 'cm ' 
+                           + params.value[1] + 'kg ';
                     }
                     else {
-                        return value[0] + ' :<br/>'
-                           + value[1] + ' : '
-                           + value[2] + 'kg ';
+                        return params.seriesName + ' :<br/>'
+                           + params.name + ' : '
+                           + params.value + 'kg ';
                     }
                 }
             },

doc/example/scatter5.html

@@ -46,10 +46,10 @@ option = {
     },
     tooltip : {
         trigger: 'item',
-        formatter : function (value) {
-            return value[0] + ' （'  + '类目' + value[2][0] + '）<br/>'
-                   + value[2][1] + ', ' 
-                   + value[2][2]; 
+        formatter : function (params) {
+            return params.seriesName + ' （'  + '类目' + params.value[0] + '）<br/>'
+                   + params.value[1] + ', ' 
+                   + params.value[2]; 
         }
     },
     toolbox: {

doc/example/scatter6.html

@@ -46,10 +46,10 @@ option = {
     },
     tooltip : {
         trigger: 'item',
-        formatter : function (value) {
-            return value[0] + ' （'  + '类目' + value[2][0] + '）<br/>'
-                   + value[2][1] + ', ' 
-                   + value[2][2]; 
+        formatter : function (params) {
+            return params.seriesName + ' （'  + '类目' + params.value[0] + '）<br/>'
+                   + params.value[1] + ', ' 
+                   + params.value[2];
         }
     },
     toolbox: {

doc/example/tooltip.html

@@ -66,9 +66,9 @@ option = {
         },
         formatter: function (params,ticket,callback) {
             console.log(params)
-            var res = 'Function formatter : <br/>' + params[0][1];
+            var res = 'Function formatter : <br/>' + params[0].name;
             for (var i = 0, l = params.length; i < l; i++) {
-                res += '<br/>' + params[i][0] + ' : ' + params[i][2];
+                res += '<br/>' + params[i].seriesName + ' : ' + params[i].value;
             }
             setTimeout(function (){
                 // 仅为了模拟异步回调

src/component/tooltip.js

@@ -635,12 +635,14 @@ define(function (require) {
                                 ? (data.value != null ? data.value : data)
                                 : '-';
                         
-                        params.push([
-                            seriesArray[i].name || '',
-                            categoryAxis.getNameByIndex(dataIndex),
-                            value,
-                            data
-                        ]);
+                        params.push({
+                            seriesIndex: seriesIndex[i],
+                            seriesName: seriesArray[i].name || '',
+                            dataIndex: dataIndex,
+                            data: data,
+                            name: categoryAxis.getNameByIndex(dataIndex),
+                            value: value
+                        });
                     }
                     this._curTicket = 'axis:' + dataIndex;
                     this._tDom.innerHTML = formatter.call(
@@ -726,6 +728,7 @@ define(function (require) {
             }
             var series = this.option.series;
             var seriesArray = [];
+            var seriesIndex = [];
 
             var formatter;
             var position;
@@ -756,6 +759,7 @@ define(function (require) {
                                || position;
                     specialCssText += this._style(this.query(series[i], 'tooltip'));
                     seriesArray.push(series[i]);
+                    seriesIndex.push(i);
                 }
             }
             if (seriesArray.length > 0) {
@@ -774,13 +778,16 @@ define(function (require) {
                                ? data
                                : {name:'', value: {dataIndex:'-'}};
                                
-                        params.push([
-                            seriesArray[i].name || '',
-                            data.name,
-                            data.value[dataIndex].value != null
-                                ? data.value[dataIndex].value : data.value[dataIndex],
-                            indicatorName
-                        ]);
+                        params.push({
+                            seriesIndex: seriesIndex[i],
+                            seriesName: seriesArray[i].name || '',
+                            dataIndex: dataIndex,
+                            data: data,
+                            name: data.name,
+                            indicator: indicatorName,
+                            value: data.value[dataIndex].value != null
+                                   ? data.value[dataIndex].value : data.value[dataIndex]
+                        });
                     }
                 }
                 if (params.length <= 0) {
@@ -800,32 +807,32 @@ define(function (require) {
                     for (var i = 0, l = params.length; i < l; i++) {
                         formatter = formatter.replace(
                             '{a' + i + '}',
-                            this._encodeHTML(params[i][0])
+                            this._encodeHTML(params[i].seriesName)
                         );
                         formatter = formatter.replace(
                             '{b' + i + '}',
-                            this._encodeHTML(params[i][1])
+                            this._encodeHTML(params[i].name)
                         );
                         formatter = formatter.replace(
                             '{c' + i + '}',
-                            this.numAddCommas(params[i][2])
+                            this.numAddCommas(params[i].value)
                         );
                         formatter = formatter.replace(
                             '{d' + i + '}',
-                            this._encodeHTML(params[i][3])
+                            this._encodeHTML(params[i].indicator)
                         );
                     }
                     this._tDom.innerHTML = formatter;
                 }
                 else {
-                    formatter = this._encodeHTML(params[0][1]) + '<br/>' 
-                                + this._encodeHTML(params[0][3]) + ' : ' 
-                                + this.numAddCommas(params[0][2]);
+                    formatter = this._encodeHTML(params[0].name) + '<br/>' 
+                                + this._encodeHTML(params[0].indicator) + ' : ' 
+                                + this.numAddCommas(params[0].value);
                     for (var i = 1, l = params.length; i < l; i++) {
-                        formatter += '<br/>' + this._encodeHTML(params[i][1]) 
+                        formatter += '<br/>' + this._encodeHTML(params[i].name) 
                                      + '<br/>';
-                        formatter += this._encodeHTML(params[i][3]) + ' : ' 
-                                     + this.numAddCommas(params[i][2]);
+                        formatter += this._encodeHTML(params[i].indicator) + ' : ' 
+                                     + this.numAddCommas(params[i].value);
                     }
                     this._tDom.innerHTML = formatter;
                 }
@@ -861,6 +868,7 @@ define(function (require) {
             }
             var serie = ecData.get(this._curTarget, 'series');
             var data = ecData.get(this._curTarget, 'data');
+            var dataIndex = ecData.get(this._curTarget, 'dataIndex');
             var name = ecData.get(this._curTarget, 'name');
             var value = ecData.get(this._curTarget, 'value');
             var special = ecData.get(this._curTarget, 'special');
@@ -897,11 +905,22 @@ define(function (require) {
             }
 
             if (typeof formatter === 'function') {
-                this._curTicket = (serie.name || '')
-                                  + ':'
-                                  + ecData.get(this._curTarget, 'dataIndex');
+                this._curTicket = (serie.name || '') + ':' + dataIndex;
                 this._tDom.innerHTML = formatter.call(
                     this.myChart,
+                    {
+                        seriesIndex: ecData.get(this._curTarget, 'seriesIndex'),
+                        seriesName: serie.name || '',
+                        dataIndex: dataIndex,
+                        data: data,
+                        name: name,
+                        value: value,
+                        percent: special,   // 饼图
+                        indicator: special, // 雷达图
+                        value2: special2,
+                        indicator2: special2
+                    },
+                    /*
                     [
                         serie.name || '',
                         name,
@@ -912,6 +931,7 @@ define(function (require) {
                         ecData.get(this._curTarget, 'seriesIndex'),
                         ecData.get(this._curTarget, 'dataIndex')
                     ],
+                    */
                     this._curTicket,
                     this._setContent
                 );