如何在angular ng2图表中使用Chart.Tooltip.positioners.coursor

Question

https://stackblitz.com/edit/ng2-chart-example

以下是js中的工作示例：https://jsfiddle.net/edicarlos10/35081nag/

我想在我的项目中使用此代码，但找不到，我该如何使用此代码。

工作示例是使用chart.js完成的，我想使用ng2图表完成，你可以在工作示例中看到工具提示在鼠标位置上是可移动的，我希望在angular项目中实现。

Chart.Tooltip.positioners.cursor = function(chartElements, coordinates) {
return coordinates;
};

Answer 1

您需要从Chart.js 导入Chart

import { Chart } from "chart.js";

然后你可以在构造函数中使用它

constructor() {
Chart.Tooltip.positioners.cursor = (chartElements, coordinates) => {
return coordinates;
};
}

并将其放入名称为"游标"的选项中

lineChartOptions: any = {
tooltips: {
intersect: false,
position: 'cursor',
mode: 'index'
}
};