javascript - HighChart 系列中的自定义符号

Question

我的网页中有一个部分，其中显示了一个 HighChart 图表，如下所示:

Highcharts.chart('container', {
    chart: {
        type: 'line'
    },
    title: {
        text: 'Monthly Average Temperature'
    },
    subtitle: {
        text: 'Source: WorldClimate.com'
    },
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },
    yAxis: {
        title: {
            text: 'Temperature (°C)'
        }
    },
    plotOptions: {
        line: {
            dataLabels: {
                enabled: true
            },
            enableMouseTracking: true
        }
    },
    series: [{
        name: 'London',
        data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
    }]
});

我们可以看到点显示为数字。我希望将数字替换为 strings，例如 '3.9%'、'4.2%'..等等。

当我更改上述代码中的数据 array 以包含“%”符号时，图表不会呈现。我想 HighCharts.js 只允许绘制数字。

'3.9%','4.2%'..等自定义符号如何在图表中显示？

请高手帮忙

谢谢

Answer 1

您可以使用 dataLabels option使用良好的格式，例如 format: "{point.y} %"

series: [{
  name: 'London',
  data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8],
  dataLabels: {
    enabled: true,
    format: "{point.y} %"
  }
}]