Highcharts, как настроить enableMouseTracking?

Question

В настоящее время я использую высокие графики для отображения данных на линейном графике. Я включил опцию enableMouseTracking, чтобы можно было увидеть значение точки, над которой зависает. Я пытаюсь добавить % в конце значения. Например, мое текущее наведение на значение выше 4,4. Мне бы хотелось, чтобы оно показывало 4.4%.

. Я пытался добавить знак процента в конец значений, которые я использовал для заполнения диаграммы, но этого не произошло. работать, поэтому я считаю, что теперь мне нужно настроить саму высокую диаграмму. Я не вижу прямой настройки раздела plotOptions в документации Highcharts.

В настоящее время отображается:

Хотелось бы отобразить : 1,8%

Highcharts.chart('container', {


    chart: {
        type: 'line',
        backgroundColor: '#fafafa', 
    },
    title: {
        text: stateArr.graphTitle
    },
    xAxis: {
        categories: '2009', '2010', '2011', '2012', '2013', '2014', '2015', '2016', '2017','2018'],
        title: {
            text: 'Year'
        },
    },
    credits: {
        text: stateArr.creditTitle,
        position: {
            align: 'right',
            verticalAlign: 'bottom',
            x: -20,
            y: -20
        }
    },
    exporting: {
        enabled: false
    },
    yAxis: {
        //categories: ['2', '4', '6', '8', '10'],
        title: {
            text: 'Percentage Change (%)'

        }
    },
    plotOptions: {
        line: {
            dataLabels: {
                enabled: false
            },
            enableMouseTracking: true
        }
    },

series: [{
    name: stateArr.stateTitle,
    data: [...stRounded],
    color: '#002F65',
    custom: {
        state: stateArr.stateTitle
    },
}, {
    name: 'US',
    color: '#0B7070',
        data: [...usRounded],

    dashStyle: "DashDot",

        }],
});

Answer 1

Вы можете создать свою собственную всплывающую подсказку с помощью tooltip.formatter .

 tooltip: {
      borderColor: '#2c3e50',
      shared: true,
      formatter: function (tooltip) {
        //u can make your custom tooltip here
        return `<span >${this.y} <br> ${this.x}%</span><br/>`             
      }
    },

это один пример демо о привычной подсказке