修改 Chart.js 中条形图的 X 轴标签 2

Question

我正在使用 ChartJS 构建条形图。我的图表包含一年中每周的一个条形图。例如，我希望每个栏的工具提示显示 "Week 15 (Apr 10 - Apr 16)"，而 x 轴中的相应标签应仅显示周数，因此“15”。

这个准确描述了我想要完成的任务，尽管我使用的是条形图，而不是散点图。我在我的条形图上尝试了该方法，并从我添加到数据集的标签中提取了周数（"Week 15 (Apr 10 - Apr 16)" --> “15”）。但是，userCallback 函数会用值“15”覆盖 x 轴标签和工具提示标签。有人可以告诉我如何只修改每个条形的 x 轴标签（而不影响工具提示标签）或建议替代方法吗？

编辑：fiddle 使用我的代码：https://jsfiddle.net/96z57gqf/。 x 轴标签是正确的，但我需要条形工具提示来保持原始值（"Week 12"、"Week 13" 等等）。

xAxes: [{
  ticks: {
    userCallback: function(value, index, values) {
      return value.replace("Week ","");
    }
  }
}]

EDIT2/SOLUTION：见https://jsfiddle.net/3ft4wrL9/。根据下面 Vinod 的回答，我修改了我的选项以包括：

tooltips: {
    mode: 'index',
    intersect: true,
    callbacks: {
      title: function(tooltipItem, data) {
        return data["labels"][tooltipItem[0]["index"]];
      }
    }
  },

Answer 1

如果您使用的是 chart.js 2，那么您可以使用记录在 here 中的工具提示回调方法，就像这样在选项中自定义您的工具提示

tooltips: {
        callbacks: {
            label: function(tooltipItem, data) {
                //TODO return what you want using value of tooltipItem and data 
            }
        }
    }

修改 Chart.js 中条形图的 X 轴标签 2

Modifying the X-Axis Labels of a Bar chart in Chart.js 2

javascript

chart.js

chart.js2