diff --git a/src/hooks/common/echarts.ts b/src/hooks/common/echarts.ts
index 3ecfee87..8e7c7281 100644
--- a/src/hooks/common/echarts.ts
+++ b/src/hooks/common/echarts.ts
@@ -113,7 +113,7 @@ export function useEcharts<T extends ECOption>(optionsFactory: () => T, hooks: C
 
   /** is chart rendered */
   function isRendered() {
-    return Boolean(domRef.value && chart);
+    return Boolean(domRef.value && chart.value);
   }
 
   /**
@@ -122,12 +122,14 @@ export function useEcharts<T extends ECOption>(optionsFactory: () => T, hooks: C
    * @param callback callback function
    */
   async function updateOptions(callback: (opts: T, optsFactory: () => T) => ECOption = () => chartOptions) {
-    if (!isRendered()) return;
-
     const updatedOpts = callback(chartOptions, optionsFactory);
 
     Object.assign(chartOptions, updatedOpts);
 
+    await nextTick();
+
+    if (!isRendered()) return;
+
     if (isRendered()) {
       chart.value?.clear();
     }
@@ -147,8 +149,6 @@ export function useEcharts<T extends ECOption>(optionsFactory: () => T, hooks: C
 
     const chartTheme = darkMode.value ? 'dark' : 'light';
 
-    await nextTick();
-
     chart.value = echarts.init(domRef.value, chartTheme);
 
     chart.value?.setOption({ ...chartOptions, backgroundColor: 'transparent' });
@@ -190,12 +190,16 @@ export function useEcharts<T extends ECOption>(optionsFactory: () => T, hooks: C
     // resize chart
     if (isRendered()) {
       resize();
+
+      return;
     }
 
     // render chart
     await render();
 
-    await onUpdated?.(chart.value!);
+    if (chart.value) {
+      await onUpdated?.(chart.value);
+    }
   }
 
   scope.run(() => {