francois/HowBadIsMyBatch
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

labeling axes in scatter chart

Browse Source
This commit is contained in:
frankknoll
2023-11-09 10:22:20 +01:00
parent f1262e8ab6
commit 99b210e4ff
2 changed files with 48 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/SymptomsCausedByCOVIDLots/js/PageInitializer.js
View File

@@ -6,7 +6,7 @@ class PageInitializer {
PageInitializer.#configureSymptom(symptom); PageInitializer.#configureSymptom(symptom);
PageInitializer.#configureVaccine(vaccine); PageInitializer.#configureVaccine(vaccine);
PageInitializer.#symptomVsSymptomChartView = new SymptomVsSymptomChartView(symptomVsSymptomChartViewElement); PageInitializer.#symptomVsSymptomChartView = new SymptomVsSymptomChartView(symptomVsSymptomChartViewElement);
PageInitializer.#symptomVsSymptomChartView.displayChart('Immunosuppression', 'Immunoglobulin therapy'); PageInitializer.#symptomVsSymptomChartView.loadAndDisplayChart('Immunosuppression', 'Immunoglobulin therapy');
} }
static #configureSymptom({ symptomSelectElement, prrByVaccineTableElement, downloadPrrByVaccineTableButton }) { static #configureSymptom({ symptomSelectElement, prrByVaccineTableElement, downloadPrrByVaccineTableButton }) {

88
docs/SymptomsCausedByCOVIDLots/js/SymptomVsSymptomChartView.js
View File

@@ -8,56 +8,62 @@ class SymptomVsSymptomChartView {
} }
// FK-TODO: refactor // FK-TODO: refactor
displayChart(symptomX, symptomY) { loadAndDisplayChart(symptomX, symptomY) {
Promise
.all([symptomX, symptomY].map(symptom => PrrByVaccineProvider.getPrrByVaccine(symptom)))
.then(([prrByLotX, prrByLotY]) => this.#displayChart(prrByLotX, prrByLotY, symptomX, symptomY));
}
#displayChart(prrByLotX, prrByLotY, symptomX, symptomY) {
if (this.#chart != null) { if (this.#chart != null) {
this.#chart.destroy(); this.#chart.destroy();
} }
// FK-TODO: move PrrByVaccineProvider.getPrrByVaccine() calls out of this function const chartData = SymptomVsSymptomChartDataProvider.getChartData({ prrByLotX, prrByLotY });
Promise const data = {
.all([symptomX, symptomY].map(symptom => PrrByVaccineProvider.getPrrByVaccine(symptom))) datasets:
.then(([prrByLotX, prrByLotY]) => { [
const chartData = SymptomVsSymptomChartDataProvider.getChartData({ prrByLotX, prrByLotY }); {
const data = {
datasets: [{
labels: chartData.labels, labels: chartData.labels,
data: chartData.data, data: chartData.data,
backgroundColor: 'rgb(0, 0, 255)' backgroundColor: 'rgb(0, 0, 255)'
}], }
}; ]
const config = { };
type: 'scatter', const config = {
data: data, type: 'scatter',
options: { data: data,
scales: { options: {
x: { scales: {
type: 'linear', x: {
position: 'bottom' type: 'linear',
} position: 'bottom',
}, title: {
plugins: { display: true,
legend: { text: 'PRR ratio of Batch for ' + symptomX
display: false }
}, },
tooltip: { y: {
callbacks: { title: {
label: function (context) { display: true,
return 'Batch: ' + context.dataset.labels[context.dataIndex]; text: 'PRR ratio of Batch for ' + symptomY
} }
} }
},
plugins: {
legend: {
display: false
},
tooltip: {
callbacks: {
label: function (context) {
return 'Batch: ' + context.dataset.labels[context.dataIndex];
} }
} }
} }
}; }
this.#chart = new Chart( }
this.#canvas, };
// { this.#chart = new Chart(this.#canvas, config);
// type: 'bar',
// plugins: [ChartDataLabels],
// data: this.#getData(ADRDescr),
// options: this.#getOptions()
// }
config);
});
} }
setData(histoDescr) { setData(histoDescr) {