如何创建自定义工具提示chart.js?

时间:2019-11-28 11:39:56

标签: javascript html reactjs charts single-page-application

我正在React.js中创建一个应用程序,我遇到了下一个问题:

我使用chart.js Doughnut组件,并且需要创建自定义工具提示。

docs中,我读到可以使用custom回调。

但是当我尝试时,我没有成功。我不知道如何在新的工具提示上返回动画。新的工具提示从0开始创建。

我不需要完全自定义的工具提示,只需要更改本机工具提示中的信息,添加我的html代码即可。

对于更改信息,我使用了label回调,但是我无法添加任何html标记来使文本变为粗体。

tooltips: {
  backgroundColor: '#fff',
  displayColors: false,
  bodyFontColor: '#000',
  callbacks: {
    label: (tooltipItem, data) => {
      let label = `${this.state.circleData.players.nick[tooltipItem.index]}`;
      console.log(label)
      return label;
    }
  }
},

我有

enter image description here

我需要

enter image description here

0 个答案:

没有答案