Moving the zerolines in ChartJS scatter chart

Question

I have a scatter chart with a single point in a ChartJS chart. However, the scales start at zero, which results in the zerolines not being displayed in the middle of the chart. I'll throw in a few images to illustrate what I'm looking for.

Wanted result:

Current Result:

(Please disregard the difference between the two images' datasets)

Here is my current code:

        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
                            }
                        }]
                    }
                },

            });

           };

I have looked at the documentation but cannot find a styling setting that allows me to move the zeroLines to 50. Is it possible for me to acheive this?

Answer 1

As suggested to me by Z. Bagley in the comments, I solved the problem simply by drawing 2 lines on the chart. This was acheived very easily with the Annotations Plugin.

After adding the plugin, I simply added the following code to my options object:

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,
            }
        }
    ]
},

That created the wanted result: