[Chartjs]-Chart.js point format data for a scatter plot

1👍

You should actually use a line chart for this which would be much more appropriate and exactly show the trend & relationship between month and the dosage.

But since you asked for scatter chart…you can do it like this :

const data = [{
    "name": "Simvastatin",
    "dose": 10,
    "dose unit": "mg",
    "freq": "qd",
    "route": "PO",
    "last fill date": "2/15/2020",
    "coverage": "100%",
    "anticipated remaining fills": 2
  },
  {
    "name": "Lisinopril",
    "dose": 5,
    "dose unit": "mg",
    "freq": "qd",
    "route": "PO",
    "last fill date": "2/15/2020",
    "coverage": "100%",
    "anticipated remaining fills": 2
  }
]

const transformedData = data.map(obj=>{
  return {
    x:new Date(obj["last fill date"]).getMonth() + 1,
    y:obj.dose,
  }
})

console.log(transformedData)

and then use as

var scatterChart = new Chart(ctx, {
        type: 'scatter',
        data: {
            datasets: [{
                label: 'Scatter Dataset',
                data: transformedData
            }]
        },
        options: {
            scales: {
                xAxes: [{
                    type: 'linear',
                    position: 'top'
                }]
            }
        }
    });
}

Hope this helps !

Leave a comment