javascript - 如何将json中的数据显示在HighCharts的tooltip中？

Question

如下效果：

全部代码：http://runjs.cn/code/uqvidqwj

Answer 1

刚才看了下源码，可能我看的不是很清楚，目前我看到的结果是如果不改动源码的话，这个功能貌似不行

源码中有这么一段：

getLabelConfig: function() {
  var point = this;
  return {
     x: point.category,
     y: point.y,
     key: point.name || point.category,
     series: point.series,
     point: point,
     percentage: point.percentage,
     total: point.total || point.stackTotal
  }
}

所以使用format的时候貌似只能替换这几个值，我暂时没有找到可以设置的地方

series的translate方法中有这几个值的计算方法

Answer 2

tooltip.formatter 函数中可以自定义 tooltip 的显示内容，具体请看 API 和 DEMO：
http://api.highcharts.com/highcharts#tooltip--formatter

http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts....

Answer 3

         ................
                data: [
                    {
                        x:xValue,
                        y:yRatio,
                        id:'id_'+ i,
                        myData:toolTipContents,
                        events:{
                            mouseOver:function(event){
                                //alert("mouseover");
                                //console.log(this);
                                //console.log(this.options.myData);
                                //chart.get('highest');
                            }
                        }
                    }],

.....
                    tooltip: {
                        shared: true,
                        useHTML: true,
                        headerFormat: '<b>'+specDateTimeStr+'{series.name}</b><br><table>',
                        pointFormat: '{point.options.myData}',
                        footerFormat: '</table>'
                    },

toolTipContents 可以使用HTML格式