Chartjs-Chart.js scatter plot data not working with array constants from php

by

2👍

✅

The problem lies in the way you provided the data. The format

data:[
    {x: [....], y: [....]}
]

is not recognized by charts.js.

If you want to display e80 and e80_avg with respect to e80_serials, you should define two datasets:

    datasets: [
        {
            label: 'E80',
            data: e80_array,
            backgroundColor: 'rgba(255, 0, 0, 0.2)',
            borderColor: 'rgb(255, 0, 0)',
            borderWidth: 1
        },
        {
            label: 'E80_avg',
            data: e80_avg_array,
            backgroundColor: 'rgba(0, 0, 255, 0.2)',
            borderColor: 'rgb(0, 0, 255)',
        }
    ]}

jsFiddle.
In this case, a line chart type would have been easier.

If you want to plot e80_avg with respect to e80, you’ll have to make each pair of data as an item: [{x: 172, y: 190}, {x: 172, y:183}, ....]

    datasets: [
        {
            label: 'E80',
            data: e80_array.map((x, i)=>({x, y: e80_avg_array[i]})),
            backgroundColor: 'rgba(255, 0, 0, 0.2)',
            borderColor: 'rgb(255, 0, 0)',
            borderWidth: 1
        }
    ]

jsFiddle.
In this case you don’t need the labels.

Leave a comment