Javascript 隐藏x轴标签,但在chart.js中显示工具提示

Javascript 隐藏x轴标签,但在chart.js中显示工具提示,javascript,html,canvas,chart.js,Javascript,Html,Canvas,Chart.js,我找到了许多答案,如何隐藏每个第n个标签,但仍然能够在工具提示中显示它。但有一个陷阱。如果标签很长,那么图表会被挤压到画布的顶部。这是合乎逻辑的。但是有没有办法隐藏标签,仍然在工具提示中显示它们,并且在计算y值时忽略它们?这样就可以从画布的顶部到底部绘制线条了 谢谢你的建议 您可以扩展折线图来执行此操作。改编自(用于条形图),删除了一些不需要的代码 我们所做的非常简单,首先将标签数组设置为空白,允许进行初始化,最后循环(第一个)数据集的点,并将标签设置为原始标签 Chart.types.Line

我找到了许多答案,如何隐藏每个第n个标签,但仍然能够在工具提示中显示它。但有一个陷阱。如果标签很长,那么图表会被挤压到画布的顶部。这是合乎逻辑的。但是有没有办法隐藏标签,仍然在工具提示中显示它们,并且在计算y值时忽略它们?这样就可以从画布的顶部到底部绘制线条了


谢谢你的建议

您可以扩展折线图来执行此操作。改编自(用于条形图),删除了一些不需要的代码

我们所做的非常简单,首先将标签数组设置为空白,允许进行初始化,最后循环(第一个)数据集的点,并将标签设置为原始标签

Chart.types.Line.extend({
  name: "LineAlt",
  initialize: function(data){
    var originalLabels = data.labels;
    data.labels = data.labels.map(function() { return '' });

    Chart.types.Line.prototype.initialize.apply(this, arguments);
    this.datasets[0].points.forEach(function(bar, i) {
      bar.label = originalLabels[i];
    });
  }
});
即使有多个数据集,也只需为第一个数据集设置标签即可-在构建multiTooltip时,标签是从第一个数据集拾取的



Fiddle-

您可以扩展折线图来完成此操作。改编自(用于条形图),删除了一些不需要的代码

我们所做的非常简单,首先将标签数组设置为空白,允许进行初始化,最后循环(第一个)数据集的点,并将标签设置为原始标签

Chart.types.Line.extend({
  name: "LineAlt",
  initialize: function(data){
    var originalLabels = data.labels;
    data.labels = data.labels.map(function() { return '' });

    Chart.types.Line.prototype.initialize.apply(this, arguments);
    this.datasets[0].points.forEach(function(bar, i) {
      bar.label = originalLabels[i];
    });
  }
});
即使有多个数据集,也只需为第一个数据集设置标签即可-在构建multiTooltip时,标签是从第一个数据集拾取的



Fiddle-

剥离标签,比如在设置到图表之前将其设置为空字符串,可能会有所帮助?当然,确实如此。但是我不知道如何在工具提示中显示它们。可能你可以用工具提示数据创建一个单独的数组。或者我记得格式化了工具提示。你可以在那里玩。你能帮我指出正确的工具吗?我真的非常感谢。@jPO-检查答案的第二部分-去除标签,比如在设置图表之前将其置为空字符串可能会有帮助?当然,确实有帮助。但是我不知道如何在工具提示中显示它们。可能你可以用工具提示数据创建一个单独的数组。或者我记得格式化了工具提示。你可以在那里玩。你能帮我指出正确的工具吗?我真的非常感谢。@jPO-检查答案的第二部分-难以置信!非常感谢。再简单一次:)难以置信!非常感谢。再简单一次:)