将数据标签添加到实体表中

问题描述 投票:1回答:1

我如何在固体量规图表的每个点前面添加数据标签。我正在尝试实现这样的目标enter image description here

谢谢

highcharts
1个回答
0
投票

您可以在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

© www.soinside.com 2019 - 2024. All rights reserved.