Highcharts中Legend动态显示点值

有时候想实现鼠标在Series上移动的时候能够在Legend的Text上动态显示对应的值。可以在页面中添加如下代码（需要在该代码前引入highcharts.js）

(function (H) {
   H.Series.prototype.point = {}; 
   H.Chart.prototype.callbacks.push(function (chart) {
       $(chart.container).bind('mousemove', function () {
           var legendOptions = chart.legend.options,
               hoverPoints = chart.hoverPoints;
           
           if (!hoverPoints && chart.hoverPoint) {
               hoverPoints = [chart.hoverPoint];
           }
           if (hoverPoints) {
               H.each(hoverPoints, function (point) {
                   point.series.point = point;
               });
               H.each(chart.legend.allItems, function (item) {
                   item.legendItem.attr({
                       text: legendOptions.labelFormat ? 
                           H.format(legendOptions.labelFormat, item) :
                           legendOptions.labelFormatter.call(item)
                   });
               });
               chart.legend.render();
           }
       });
   });
   // 隐藏tooltip，允许crosshair
   H.Tooltip.prototype.defaultFormatter = function () { return false; };
}(Highcharts));

 

转载于:https://www.cnblogs.com/ecosu/p/4738591.html