Refactor charts component (#295)

Reviewed-on: #295
2024-09-19 20:26:42 +02:00
parent c3dbecca67
commit aa7c6de313
14 changed files with 458 additions and 594 deletions
--- a/assets/js/echarts-locale.js
+++ b/assets/js/echarts-locale.js
@ -0,0 +1,123 @@
+// @ts-ignore
+echarts.registerLocale("DE", {
+  time: {
+    month: [
+      "Januar",
+      "Februar",
+      "März",
+      "April",
+      "Mai",
+      "Juni",
+      "Juli",
+      "August",
+      "September",
+      "Oktober",
+      "November",
+      "Dezember",
+    ],
+    monthAbbr: ["Jan", "Feb", "Mar", "Apr", "Mai", "Jun", "Jul", "Aug", "Sep", "Okt", "Nov", "Dez"],
+    dayOfWeek: ["Sonntag", "Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag"],
+    dayOfWeekAbbr: ["So", "Mo", "Di", "Mi", "Do", "Fr", "Sa"],
+  },
+  legend: {
+    selector: {
+      all: "Alle",
+      inverse: "Invertiert",
+    },
+  },
+  toolbox: {
+    brush: {
+      title: {
+        rect: "Box Auswahl",
+        polygon: "Lasso Auswahl",
+        lineX: "Horizontale Auswahl",
+        lineY: "Vertikale Auswahl",
+        keep: "Bereich Auswahl",
+        clear: "Auswahl zurücksetzen",
+      },
+    },
+    dataView: {
+      title: "Daten Ansicht",
+      lang: ["Daten Ansicht", "Schließen", "Aktualisieren"],
+    },
+    dataZoom: {
+      title: {
+        zoom: "Zoom",
+        back: "Zoom zurücksetzen",
+      },
+    },
+    magicType: {
+      title: {
+        line: "Zu Liniendiagramm wechseln",
+        bar: "Zu Balkendiagramm wechseln",
+        stack: "Stapel",
+        tiled: "Kachel",
+      },
+    },
+    restore: {
+      title: "Wiederherstellen",
+    },
+    saveAsImage: {
+      title: "Als Bild speichern",
+      lang: ["Rechtsklick zum Speichern des Bildes"],
+    },
+  },
+  series: {
+    typeNames: {
+      pie: "Tortendiagramm",
+      bar: "Balkendiagramm",
+      line: "Liniendiagramm",
+      scatter: "Streudiagramm",
+      effectScatter: "Welligkeits-Streudiagramm",
+      radar: "Radar-Karte",
+      tree: "Baum",
+      treemap: "Baumkarte",
+      boxplot: "Boxplot",
+      candlestick: "Kerzenständer",
+      k: "K Liniendiagramm",
+      heatmap: "Heatmap",
+      map: "Karte",
+      parallel: "Parallele Koordinatenkarte",
+      lines: "Liniendiagramm",
+      graph: "Beziehungsgrafik",
+      sankey: "Sankey-Diagramm",
+      funnel: "Trichterdiagramm",
+      gauge: "Meßanzeige",
+      pictorialBar: "Bildlicher Balken",
+      themeRiver: "Thematische Flusskarte",
+      sunburst: "Sonnenausbruch",
+    },
+  },
+  aria: {
+    general: {
+      withTitle: 'Dies ist ein Diagramm über "{title}"',
+      withoutTitle: "Dies ist ein Diagramm",
+    },
+    series: {
+      single: {
+        prefix: "",
+        withName: " mit Typ {seriesType} namens {seriesName}.",
+        withoutName: " mit Typ {seriesType}.",
+      },
+      multiple: {
+        prefix: ". Es besteht aus {seriesCount} Serienzählung.",
+        withName: " Die Serie {seriesId} ist ein {seriesType} welcher {seriesName} darstellt.",
+        withoutName: " Die {seriesId}-Reihe ist ein {seriesType}.",
+        separator: {
+          middle: "",
+          end: "",
+        },
+      },
+    },
+    data: {
+      allData: "Die Daten sind wie folgt: ",
+      partialData: "Die ersten {displayCnt} Elemente sind: ",
+      withName: "die Daten für {name} sind {value}",
+      withoutName: "{value}",
+      separator: {
+        middle: ",",
+        end: ".",
+      },
+    },
+  },
+});