Javascript 异步加载Chart.js工具提示信息

我知道我们可以使用以下代码加载图表工具提示的信息：

window.myLine=新图表（图表、{
键入：“行”，
数据：线形图表数据，
选项：{
工具提示：{
启用：对，
模式：“单一”，
回调：{
标签：函数（工具提示项、数据）{
返回tooltipItems.yLabel+“€”；
}
}
},
}
});

---

问题是，在我的例子中，我需要调用一个函数并异步返回值；可能会显示微调器，直到响应就绪。如何实现这一点？

您可以改为异步调用chart.jsupdate（）方法。如果标签应取决于用户悬停的数据点，则可能还需要使用递归

window.myLine = new Chart(chart, {
  type: 'line',
  data: lineChartData,
  options: {
    tooltips: {
      enabled: true,
      mode: 'single',
      callbacks: {
        label: asyncTooltipLabel
      }
    },
  }
});

function asyncTooltipLabel(tooltipItems, data) {
  // some asynchronous function call
  setTimeout(function() {
    // when asyncronous result comes
    const result = (tooltipItems[0].index * 2) + ' €';

    const newTooltipConfig = {
       enabled: true,
       mode: 'single',
       callbacks: {
           label: function(newTooltipItems, newData) {
              if (newTooltipItems[0].index === tooltipItems[0].index && newTooltipItems[0].datasetIndex === tooltipItems[0].datasetIndex) return result;
              else asyncTooltipLabel(newTooltipItems, newData);
           }
       }
    }

    // apply new tooltip config
    window.myLine.options.tooltips = newTooltipConfig;
    window.myLine.update();
  }, 2000);
}

---

我还在Angular 8中使用chartjs。