From 5a4222ede0cc3612123715e892b2625041978ead Mon Sep 17 00:00:00 2001 From: Jim O'Donnell Date: Thu, 6 Jun 2024 12:36:28 +0100 Subject: [PATCH 1/5] refactor(subject previews): allow for single series JSON data subjects Refactor previews for JSON data subjects to include subjects with a single `x,y` data series. `getDatasets(data)` reflects on the type of data, then calls an appropriate helper function to convert `data` into an array of `chart.js` datasets. --- app/features/modelling/line-plot/index.js | 52 +++++++++++++++-------- 1 file changed, 34 insertions(+), 18 deletions(-) diff --git a/app/features/modelling/line-plot/index.js b/app/features/modelling/line-plot/index.js index e790f89d6f..168b1c2947 100644 --- a/app/features/modelling/line-plot/index.js +++ b/app/features/modelling/line-plot/index.js @@ -1,5 +1,37 @@ import { Chart } from 'chart.js/auto'; +function getXYData(data) { + return { + data: data.x.map((x, index) => ({ x, y: data.y[index] })), + pointStyle: 'circle', + backgroundColor: '#ffffff', + borderColor: '#000000' + } +} + +function getSeriesData(series, index) { + const { seriesData, seriesOptions } = series; + return { + data: seriesData, + label: seriesOptions.label || `Series ${index + 1}`, + pointStyle: seriesOptions.glyph, + backgroundColor: seriesOptions.color, + borderColor: '#000000' + }; +} + +function getDatasets(data) { + if (data?.datasets) { + return data.datasets; + } + if (data?.map) { + return data.map(getSeriesData); + } + if (data.x && data.y) { + return [getXYData(data)]; + } +} + // Help at http://www.chartjs.org/docs/latest class LinePlotModel { constructor(canvas, { frame, src }, { onLoad, modelDidError }) { @@ -8,24 +40,8 @@ class LinePlotModel { this.frame = frame; fetch(`${src}?=`) .then(response => response.json()) - .then((data) => { - let datasets; - const { chartOptions, data: FEMdata, ...rest } = data; - if (FEMdata) { - datasets = FEMdata.map( (data, index) => { - const { seriesData, seriesOptions } = data - return { - data: seriesData, - label: seriesOptions.label || `Series ${index + 1}`, - pointStyle: seriesOptions.glyph, - backgroundColor: seriesOptions.color, - borderColor: '#000000' - } - }); - } - if (data.datasets) { - datasets = data.datasets - } + .then(({ data, chartOptions, ...rest }) => { + const datasets = getDatasets(data); console.log({ type: 'scatter', data: { From aa0bc7989790a0681af7a769adb19943d25d6711 Mon Sep 17 00:00:00 2001 From: Jim O'Donnell Date: Thu, 6 Jun 2024 13:14:10 +0100 Subject: [PATCH 2/5] Support PH-TESS subjects, which are `{ x: number[], y: number[] }` --- app/features/modelling/line-plot/index.js | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) diff --git a/app/features/modelling/line-plot/index.js b/app/features/modelling/line-plot/index.js index 168b1c2947..6f91990a86 100644 --- a/app/features/modelling/line-plot/index.js +++ b/app/features/modelling/line-plot/index.js @@ -40,6 +40,23 @@ class LinePlotModel { this.frame = frame; fetch(`${src}?=`) .then(response => response.json()) + .then(data => { + if(data.x && data.y) { + return { + data: { + x: data.x, + y: data.y + } + }, + { + chartOptions: { + xAxisLabel: 'Days', + yAxisLabel: 'Brightness' + } + }; + } + return data; + }) .then(({ data, chartOptions, ...rest }) => { const datasets = getDatasets(data); console.log({ From 740b65285f2b445beeb464fcd9321b39698573c6 Mon Sep 17 00:00:00 2001 From: Jim O'Donnell Date: Thu, 6 Jun 2024 15:58:11 +0100 Subject: [PATCH 3/5] Add a default return when there's no data --- app/features/modelling/line-plot/index.js | 1 + 1 file changed, 1 insertion(+) diff --git a/app/features/modelling/line-plot/index.js b/app/features/modelling/line-plot/index.js index 6f91990a86..695ac3546c 100644 --- a/app/features/modelling/line-plot/index.js +++ b/app/features/modelling/line-plot/index.js @@ -30,6 +30,7 @@ function getDatasets(data) { if (data.x && data.y) { return [getXYData(data)]; } + return []; } // Help at http://www.chartjs.org/docs/latest From 9f4d85efdaf7a333ccbf7310031529c914559822 Mon Sep 17 00:00:00 2001 From: Jim O'Donnell Date: Thu, 6 Jun 2024 16:00:32 +0100 Subject: [PATCH 4/5] FIx a typo in the data object --- app/features/modelling/line-plot/index.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/app/features/modelling/line-plot/index.js b/app/features/modelling/line-plot/index.js index 695ac3546c..a6d5e5552f 100644 --- a/app/features/modelling/line-plot/index.js +++ b/app/features/modelling/line-plot/index.js @@ -47,9 +47,7 @@ class LinePlotModel { data: { x: data.x, y: data.y - } - }, - { + }, chartOptions: { xAxisLabel: 'Days', yAxisLabel: 'Brightness' From 939d235167354c87e3e9e49039ff2ea3fa631117 Mon Sep 17 00:00:00 2001 From: Jim O'Donnell Date: Thu, 6 Jun 2024 16:09:16 +0100 Subject: [PATCH 5/5] allow for undefined data (no data in the response) --- app/features/modelling/line-plot/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/features/modelling/line-plot/index.js b/app/features/modelling/line-plot/index.js index a6d5e5552f..9735437e68 100644 --- a/app/features/modelling/line-plot/index.js +++ b/app/features/modelling/line-plot/index.js @@ -27,7 +27,7 @@ function getDatasets(data) { if (data?.map) { return data.map(getSeriesData); } - if (data.x && data.y) { + if (data?.x && data?.y) { return [getXYData(data)]; } return [];