如何在数据标签中提供断点

Question

如何在数据标签中给出断路线，直到我在下面完成的是链接，我也在这里粘贴了代码。

我正在使用自定义数据标签，我想添加Break Line

https://jsfiddle.net/0x3ct8aq/4/

<script>
    onComplete () {
       const chartInstance = this.chart;
      const ctx = chartInstance.ctx;
      const dataset = this.data.datasets[0];
      const meta = chartInstance.controller.getDatasetMeta(0);
      Chart.helpers.each(meta.data.forEach((bar, index) => {
        const label = this.data.customlabels[index];
        const labelPositionX = 20;
        const labelWidth = ctx.measureText(label).width + labelPositionX;
        ctx.textBaseline = 'bottom';
        ctx.textAlign = 'center';
        ctx.fillStyle = '#fff';
        console.log(label.x);
        ctx.fillText(label, bar._model.x, bar._model.y);
      }));

    }
  } 
    },

});
</script>

Answer 1

在animation.onComplete()函数中，您可以reverse()标签数组，然后使用forEach()绘制单个令牌，如下：

label.reverse().forEach((l, i) => ctx.fillText(l, bar._model.x, bar._model.y - (i * 16)))

请看看您的修订 JSFIDDLE