如何在数据标签中给断线

Question

如何在数据标签中添加换行符，直到我在下面做的是链接并且我也将代码粘贴到这里。

我正在使用自定义datalabel，我想添加换行符

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