Javascript 在ChartJS散点图中移动零线

Javascript 在ChartJS散点图中移动零线,javascript,chart.js,Javascript,Chart.js,我有一张散点图,图中只有一个点。然而,音阶从零开始,这导致零线没有显示在图表中间。我会加入一些图片来说明我在寻找什么 想要的结果: 当前结果: (请忽略两幅图像数据集之间的差异) 这是我目前的代码: window.onload = function() { var ctx = document.getElementById('canvas').getContext('2d'); window.myScatter = Chart.

我有一张散点图,图中只有一个点。然而,音阶从零开始,这导致零线没有显示在图表中间。我会加入一些图片来说明我在寻找什么

想要的结果:

当前结果:

(请忽略两幅图像数据集之间的差异)

这是我目前的代码:

        window.onload = function() {
            var ctx = document.getElementById('canvas').getContext('2d');
            window.myScatter = Chart.Scatter(ctx, {
                data: {
                    datasets: [{
                        backgroundColor: '#000000',
                        borderColor: '#000000',
                        data: [{
                            x: 61.01,
                            y: 62.87
                        }]
                    }]
                },
                options: {
                    title: {
                        display: false,
                    },
                    scales: {
                        xAxes: [{
                            ticks: {
                                beginAtZero: false,
                                max: 100,
                                min: 0,
                                stepSize: 20
                            },
                            gridLines: {
                                display: true,
                            }
                        }],
                        yAxes: [{
                            ticks: {
                                beginAtZero: false,
                                max: 100,
                                min: 0,
                                stepSize: 20
                            }
                        }]
                    }
                },

            });

           };

我已经查看了,但找不到允许我将零线移动到50的样式设置。我能做到这一点吗?

正如Z.Bagley在评论中向我建议的那样,我只需在图表上画两条线就解决了这个问题。这是很容易实现的

添加插件后,我只需将以下代码添加到我的options对象中:

annotation: {
    annotations: [
        {
            drawTime: 'afterDraw',
            type: 'line',
            mode: 'horizontal',
            scaleID: 'y-axis-1',
            value: 50,
            borderColor: '#005a99',
            borderWidth: 4,
            label: {
                enabled: false,
            }
        },
        {
            drawTime: 'afterDraw',
            type: 'line',
            mode: 'vertical',
            scaleID: 'x-axis-1',
            value: 50,
            borderColor: '#005a99',
            borderWidth: 4,
            label: {
                enabled: false,
            }
        }
    ]
},
产生了想要的结果:


诀窍是禁用轴样式,只需绘制两条单独的线谢谢。添加了我的工作解决方案作为答案