HighCharts泡泡数据标签颜色

Question

我需要更改mouseOver事件上的dataLabel颜色。可能吗？ 预先感谢您。

Answer 1

您可以使用它并尝试更改鼠标悬停上的颜色。

来源：http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/plotoptions/series-point-events-mouseover/

http://api.highcharts.com/highcharts#plotOptions.series.enableMouseTracking

 plotOptions: { 
     series: { 
      point: { 
       events: { 
        mouseOver: function() { 
         var chart = this.series.chart; 
         if (!chart.lbl) { 
          chart.lbl = chart.renderer.label('') 
           .attr({ 
            padding: 10, 
            r: 10, 
            fill: Highcharts.getOptions().colors[1] 
           }) 
           .css({ 
            color: 'red' 
           }) 
           .add(); 
         } 
         chart.lbl 
          .show() 
          .attr({ 
           text: 'x: ' + this.x + ', y: ' + this.y 
          }); 
        } 
       } 
      }, 
      events: { 
       mouseOut: function() { 
        if (this.chart.lbl) { 
         this.chart.lbl.hide(); 
        } 
       } 
      } 
     } 
    } 

Answer 2

您可以在每个datalabel和捕捉鼠标悬停/鼠标移开动作重复。然后调用css（）并设置颜色。

 $.each(chart.series[0].points, function(i,point){ 
      this.dataLabel.on('mouseover',function(){ 
       point.dataLabel.css({ 
        color: 'red' 
       }); 
      }).on('mouseout',function(){ 
       point.dataLabel.css({ 
        color: 'black' 
       }); 
      }); 
     }); 

实施例：http://jsfiddle.net/Utx8g/377/