Блог

я использую highchart для отображения линейной диаграммы. Я добавил несколько аннотаций.

 annotations: [{
                            labels: [
        
        {
            point: {
                x: 1,
                y: 13.120689655172,
                xAxis: 0,
                yAxis: 0
            },
            text: '( ) New Line First'
        },
        
        {
            point: {
                x: 8,
                y: 16.1,
                xAxis: 0,
                yAxis: 0
            },
            text: '( ) Sold Some Books'
        },],
  

Мне нравится создавать кнопку для отображения / скрытия этих аннотаций. Кто-нибудь может мне помочь?
Я не знаю, как создать кнопку и показать, скрыть их.

Спасибо

Я подготовил демонстрацию с пользовательской кнопкой, которая скрывает / показывает аннотации.

Демонстрация:https://jsfiddle.net/BlackLabel/75gmt0v3 /

 let btn = document.getElementById('btn');

btn.addEventListener('click', function() {
    
  if (chart.annotationVisible) {
    chart.annotations[0].graphic.hide();
    chart.annotationVisible = false;
  } else {
    chart.annotations[0].graphic.show();
    chart.annotationVisible = true;
  }
})
  

Если вы хотите отобразить эту кнопку как часть диаграммы, используйте SVGRenderer инструмент — https://api.highcharts.com/class-reference/Highcharts .SVGRenderer#кнопка