Chartjs 在 0,1,2 位置绘制我的值，而不是沿 x 轴绘制它们的值答案

【问题标题】：Chartjs is graphing my values at positions 0,1,2 rather than their values along the x axisChartjs 在 0,1,2 位置绘制我的值，而不是沿 x 轴绘制它们的值
【发布时间】：2021-06-14 14:30:08
【问题描述】：

我有两个折线图，第一个工作正常，第二个只是位于第一个顶部的 3 个点，表示主峰值点、左侧峰值和右侧峰值。我正在为原始折线图传入一个值和标签数组，效果很好。我还为峰值点传入了一个 values2 和一个 labels2 数组。这些值是正确的。两者都是浮点值，看起来都像下面这样，显然每次都有不同的值

values2 = [-76.334, -90.648, -89.625]

labels2 = [1.83, 1.93546, 1.76815]

这是我的 html 文件中的 chartjs 代码

        <div id="canvas-holder">
        <canvas id="myChart" width="800" height="300"></canvas>
    </div>
    <script>
        var options = {
        type: 'line',
        data: {
            labels: {{ labels | safe }},
            datasets: [{
                    label: 'Value',
                    data: {{ values | safe }},
                    backgroundColor: 'white',
                    borderWidth: 1,
                    order: 2
                },
                {
                    label: 'Peak value',
                    data: [{
                    x: {{ labels2[0] | safe }},
                    y: {{ values2[0] | safe }}
                    }, {
                    x: {{ labels2[1] | safe }},
                    y: {{ values2[1] | safe }}
                    }, {
                    x: {{ labels2[2] | safe }},
                    y: {{ values2[2] | safe }}
                    }],
                    backgroundColor: 'black',
                    borderWidth: 5,
                    pointRadius: 5,
                    showLine: false,
                    order: 1
                }
            ]
        },
        options: {
            responsive: true,
        scales: {
            xAxes: [{
                ticks: {
                    beginAtZero: true
                }
            }]
        }
    }
};

    var ctx = document.getElementById('myChart').getContext('2d');
    new Chart(ctx, options);

如果我正确理解了 chartjs，我相信这应该可以工作。每个值都映射到它对应的 x 和 y 值，我不确定这有什么问题。我将不胜感激。

【问题讨论】：

标签： javascript graph charts chart.js

【解决方案1】：

对于将来的任何人，我发现切换到旧版本的 chartjs 可以使这项工作正常进行。我不知道是否有一种新的方法来绘制两个图表或什么，但我切换到版本 2.9.X 并且它工作了

【讨论】：