feat: update echarts theme when theme changes

evidence-dev · Oct 15, 2024 · 9897228 · 9897228
1 parent 659d044
commit 9897228
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 699 deletions.
diff --git a/packages/lib/component-utilities/src/echarts.js b/packages/lib/component-utilities/src/echarts.js
@@ -17,6 +17,7 @@ const ANIMATION_DURATION = 500;
 /** @param {HTMLElement} node */
 /** @param {Options} options */
 const echartsAction = (node, options) => {
+	console.log('use:echarts', options.theme);
 	// https://github.com/evidence-dev/evidence/issues/1323
 	const useSvg =
 		['iPad Simulator', 'iPhone Simulator', 'iPod Simulator', 'iPad', 'iPhone', 'iPod'].includes(
@@ -27,7 +28,7 @@ const echartsAction = (node, options) => {
 	registerTheme('light', evidenceThemeLight);
 	registerTheme('dark', evidenceThemeDark);
 
-	const chart = init(node, options.theme, {
+	let chart = init(node, options.theme, {
 		renderer: useSvg ? 'svg' : (options.renderer ?? 'canvas')
 	});
 
@@ -181,6 +182,13 @@ const echartsAction = (node, options) => {
 
 	/** @param {Options} newOptions */
 	const updateChart = (newOptions) => {
+		if (newOptions.theme !== options.theme) {
+			chart.dispose();
+			chart = init(node, newOptions.theme, {
+				renderer: useSvg ? 'svg' : (newOptions.renderer ?? 'canvas')
+			});
+		}
+
 		options = newOptions;
 		chart.setOption(
 			{