Chart.js 在最后一个 x 轴标签之前出现尴尬的标签间隙

Question

对于 Chart.js，有人知道处理 x 轴标签间距的好方法吗？在最后一个标签之前可能有一个大标签间隙？我正在处理的图表有太多的 x 轴度量，无法为每个条打开标签。我知道这显然与 x 轴标签跳过逻辑有关，它在最后一个 x 轴度量上产生一个间隙以获取标签。

如何使带有标签跳过的图表在结束前没有大/尴尬差距的情况下更具视觉吸引力？

Answer 1

自 2016 年 9 月以来，这一直是已知的 issue，并且已在今年（2018 年）12 月合并了 pull request。

正如您在@sgray 的这些小提琴中看到的那样，它完美地工作，它们显示了当前的错误：/61thywor，并修复了：/9t7bs01j。 （如果不发布任何代码，我无法发布完整的小提琴 URL。）

此版本尚未发布，但将包含在 v2.8 版本中，但尚未给出可能的发布日期。

同时，你可以试试@RuchiDhore推荐的这个solution。

您可以尝试以下 2 个选项：

1. 如果您的标签是 60，则将它们设为 61，在这种情况下，间隙不会出现， 因为在第 59 次之后，第 60 次将被跳过，第 61 次（最后一个）将 被显示。但是这个解决方案的问题是当屏幕尺寸 变化，可能会出现差距重新出现的情况..这取决于 根据您的项目要求..这个选项不太可行！

2. 在第 59 位绘制网格线，其标签使用插件，隐藏标签 在第 60 位，让第 59 位和第 60 位之间的差距保持原样。 所以在那种情况下，差距会存在，但看起来并不那么 坏以及标签不会在第 59 和第 60 位重叠。