Question

我使用Chart.js版本2.1.3创建折线图。

我想在x轴上的网格线之间居中标记和点（如条形图中所示）。

对于标签，我使用选项＆＃39; offsetGridLines＆＃39;从网格线偏移标签：

scales: {
    xAxes: [{
        gridLines: {
            offsetGridLines: true
        }
    }],
    ...

尽管如此，我找不到中心点的便捷解决方案。

这是我的初始示例（放置在网格线之间的标签）：https://jsfiddle.net/24aotbnc/1/。

这是我的非优雅解决方案，它创建了一个类型为＆＃39; bar＆＃39;的空数据集。并在创建图表后删除它（在网格线之间绘制点）：https://jsfiddle.net/24aotbnc/2/

有人可以提供更好的解决方案吗？感谢。

Answer 1

线点的位置x（有或没有偏移）仅基于数据集长度计算

 var includeOffset = (labels.length === 1 || dataset.data.length === 1) || me.chart.isCombo;
 x = xScale.getPixelForValue(typeof value === 'object' ? value : NaN, index, datasetIndex, includeOffset);

因此，includeOffset决定该区域的线点位置在中间或左侧，无法配置它。

Chart.js - 折线图：在网格线之间绘制点

1 个答案: