Диаграмма. js данные в формате точек для точечной диаграммы

Question

Диаграмма. js Точечная диаграмма принимает данные только в формате точек (x, y). Я пытаюсь заполнить точки данных информацией о лекарствах из файла под названием meds. json Точнее, x будет месяцем последнего заполнения лекарства, а y будет дозой.

Как я могу получить все эти данные из файла meds. json и вставить их в данные, чтобы создать точки для моего графика рассеяния? Если я попытаюсь захватить все даты и сохранить их в массиве, а все значения доз в другом массиве, как я могу использовать это для заполнения данных точек с помощью этих массивов?

Вот как создать диаграмму рассеяния, используя Диаграмма. js, я пытаюсь заполнить точки x, y в data 'data':

// charts.js
var scatterChart = new Chart(ctx, {
        type: 'scatter',
        data: {
            datasets: [{
                label: 'Scatter Dataset',
                data: [{
                    // x = month, y = dose
                    // fill these in for all meds in the json file
                    x: -10,
                    y: 0
                }, {
                    x: 0,
                    y: 10
                }, {
                    x: 10,
                    y: 5
                }]
            }]
        },
        options: {
            scales: {
                xAxes: [{
                    type: 'linear',
                    position: 'top'
                }]
            }
        }
    });
}

med. json

[
  {
    "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
  }  

    ...... The list goes on

]

Answer 1

На самом деле вам следует использовать для этого линейную диаграмму, которая будет намного более подходящей и точно покажет тенденцию и взаимосвязь между месяцем и дозировкой.

Но раз уж вы запросили диаграмму разброса ... вы можете сделать это так:

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)

, а затем используйте как

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

Надеюсь, это поможет!