Добавьте dataLabels к solid guage

Question

Как я могу добавить метку данных перед каждой точкой на solid диаграмме датчика. Я пытаюсь добиться чего-то вроде этого

Спасибо

Answer 1

Вы можете добавить собственные метки данных в событие render, например:

chart: {
  ...,
  events: {
    render: function() {
      var dataLabels = ['Custom DL1', 'Custom DL2', 'Custom DL3'],
        chart = this,
        series = chart.series;

      dataLabels.forEach(function(dl, i) {
        if (!series[i].customDL) {
          series[i].customDL = chart.renderer.text(dl)
            .attr({
              zIndex: 10
            })
            .add(series[i].group);
        }

        series[i].customDL.translate(
          chart.chartWidth / 2 + 10,
          chart.plotHeight / 2 - series[i].points[0].shapeArgs.innerR -
          (series[i].points[0].shapeArgs.r - series[i].points[0].shapeArgs.innerR) / 2
        );
      });
    }
  }
}

---

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

Справочник по API:

https://api.highcharts.com/highcharts/chart.events.render

https://api.highcharts.com/class-reference/Highcharts.SVGRenderer#text