refactoring

docs/SymptomsCausedByCOVIDLots/js/SymptomVsSymptomChartView.js

@@ -12,33 +12,45 @@ class SymptomVsSymptomChartView {
         Promise
             .all([symptomX, symptomY].map(symptom => PrrByVaccineProvider.getPrrByVaccine(symptom)))
             .then(
-                ([prrByLotX, prrByLotY]) =>
+                ([prrByLotX, prrByLotY]) => {
-                    this.#displayChart(
+                    const { labels, data } = SymptomVsSymptomChartDataProvider.getChartData({ prrByLotX, prrByLotY });
-                        { symptom: symptomX, prrByLot: prrByLotX },
+                    this.#displayChart(symptomX, symptomY, labels, data);
-                        { symptom: symptomY, prrByLot: prrByLotY }));
+                });
     }
 
-    #displayChart(
+    setData(histoDescr) {
-        { symptom: symptomX, prrByLot: prrByLotX },
+        const data = this.#getData(histoDescr);
-        { symptom: symptomY, prrByLot: prrByLotY }) {
+        this.#chart.config.data = data;
+        this.#chart.update();
+    }
+
+    #displayChart(symptomX, symptomY, labels, data) {
         if (this.#chart != null) {
             this.#chart.destroy();
         }
-        const chartData = SymptomVsSymptomChartDataProvider.getChartData({ prrByLotX, prrByLotY });
+        const config = {
-        const data = {
+            type: 'scatter',
+            data: this.#getData(labels, data),
+            options: this.#getOptions(symptomX, symptomY)
+        };
+        this.#chart = new Chart(this.#canvas, config);
+    }
+
+    #getData(labels, data) {
+        return {
             datasets:
                 [
                     {
-                        labels: chartData.labels,
+                        labels: labels,
-                        data: chartData.data,
+                        data: data,
                         backgroundColor: 'rgb(0, 0, 255)'
                     }
                 ]
         };
-        const config = {
+    }
-            type: 'scatter',
+
-            data: data,
+    #getOptions(symptomX, symptomY) {
-            options: {
+        return {
             scales: {
                 x: {
                     type: 'linear',
@@ -67,62 +79,6 @@ class SymptomVsSymptomChartView {
                     }
                 }
             }
-            }
-        };
-        this.#chart = new Chart(this.#canvas, config);
-    }
-
-    setData(histoDescr) {
-        const data = this.#getData(histoDescr);
-        this.#chart.config.data = data;
-        this.#chart.update();
-    }
-
-    #getData(ADRDescr) {
-        return {
-            labels: [
-                'Deaths',
-                'Disabilities',
-                'Life Threatening Illnesses',
-                'Other Adverse Events'
-            ],
-            datasets: [{
-                // FK-TODO: refactor
-                label: 'Batch ' + ADRDescr['batchcode'],
-                data: [
-                    ADRDescr['Deaths'],
-                    ADRDescr['Disabilities'],
-                    ADRDescr['Life Threatening Illnesses'],
-                    ADRDescr['Adverse Reaction Reports'] - (ADRDescr['Deaths'] + ADRDescr['Disabilities'] + ADRDescr['Life Threatening Illnesses'])
-                ],
-                backgroundColor: '#1a73e8'
-            }]
-        };
-    }
-
-    #getOptions() {
-        return {
-            plugins: {
-                datalabels: {
-                    anchor: 'end',
-                    align: 'top'
-                }
-            },
-            title: {
-                display: true,
-                position: 'top'
-            },
-            scales: {
-                y: {
-                    ticks: {
-                        precision: 0
-                    },
-                    title: {
-                        display: true,
-                        text: 'Frequency'
-                    }
-                }
-            }
         };
     }
 }