Chartjs fiddle not working

Question

I'm completely new to JSFiddle. I'm currently trying to get a scatter chart to show up but nothing is displaying. Can anyone point me in the right direction?

Here's the Fiddle: http://jsfiddle.net/roka545/qf8ejytt/

//Get context with jQuery - using jQuery's .get() method.
let canvas = <HTMLCanvasElement>document.getElementById("myChart");
let ctx = canvas.getContext("2d");

let xAxisMin: number = 4;
let xAxisMax: number = 7;

var scatterChart = new Chart(ctx, {
    type: 'line',
    data: {
        datasets: [{
            label: 'Scatter Dataset',
            data: [{
                x: -10,
                y: 0
            }, {
                x: 0,
                y: 10
            }, {
                x: 10,
                y: 5
            }]
        }]
    },
    options: {
        scales: {
            xAxes: [{
                type: 'linear',
                position: 'bottom'
            }]
        }
    }
});

Answer 1

You need to add a link to the actual source such as:

https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.2.1/Chart.min.js

In the external resources, then press plus button.

See here:

http://jsfiddle.net/r7ahsn15/

Answer 2

Did you look at the console? It says:

And that's because:

Meaning that the link you provided was over http rather than https as jsfiddle. Browsers don't allow that kind of requests ( http inside https sites) for security reasons.

Nevertheless, I'm searching for a working example and it seems that all the chart.js fiddles are having the same error:

https://jsfiddle.net/uc25erpc/

https://jsfiddle.net/achudars/NXPhL/

http://fiddle.jshell.net/leighking2/898kzyp7/