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/