HighCharts on hover change dataLabel размер шрифта

Question

У меня есть highchart пирога, и я хочу изменить размер шрифта DataLabels, когда я навис над определенной частью пирога.

Я обнаружил, что событие парения устанавливается следующим образом:

plotOptions: { 

      series: { 
       shadow: { 
       color: '#000', 
       offsetX : 5, 
       offsetY : 5, 
       opacity : 0.5 
       }, 
       events: { 
        mouseOver: function(event) { 

        }, 
        mouseOut: function(event) { 

        } 
       } 

      } 

, но я не знаю, как получить доступ к dataLabel внутри MouseOver/Out.

Answer 1

Вы можете добраться до dataLabel через this.dataLabel в пределах point событий для series:

series: { 
    point: { 
     events: { 
      mouseOver: function (e) { 
       this.dataLabel.css({ 
        fontSize: "30px", 
       }); 
      }, 
      mouseOut: function (e) { 
       this.dataLabel.css({ 
        fontSize: "12px", 
       }); 
      } 
     } 
    } 
} 

Demo

Answer 2

Является ли dataLabel ссылкой на HTML? Если вы хотите получить доступ к dataLabel вы можете сделать это в JavaScript, как это (предполагая, что HTML-элемент, идентификатор):

document.getElementById("dataLabel").setAttribute("style", "font-size: 20px"); 

Это установить размер шрифта dataLabel на 20px. Вы можете поместить это внутри функции события мыши, которую вы хотите.