如何获取指定图表项索引的X位置？

Question

我正在绘制一个包含多个数据集的条形图，需要在指定的项目索引处绘制一条垂直线，即

// chartData:
{
  labels: ['lbl0', 'lbl1', 'lbl2'],
  datasets: [{
    label: 'dataset1',
    data: [12.84, 13.75, 14.86]
  },
  {
    label: 'dataset2,
    data: [25.14, 15.61, 10.81]
  }]
}

有没有办法获取属于标签 lbl1 的第一个或所有工具提示的 X 坐标？

Answer 1

是的，你可以使用 getPixelForValue

const chart = new Chart(ctx, config);
const x = chart.scales.x.getPixelForValue('lbl1');

您也可以选择使用注释插件，您只需给出标签，它就会为您画线：

https://www.chartjs.org/chartjs-plugin-annotation/

如何获取指定图表项索引的X位置？

How to get the X position at a specified chart item index?

chart.js