|
|
@@ -1,6 +1,5 @@
|
|
|
import { ref, onMounted, onUnmounted, getCurrentInstance } from 'vue'
|
|
|
import { debounce } from '@/utils/time'
|
|
|
-import { v4 } from 'uuid'
|
|
|
import { getTheme, ThemeEnum } from '@/common/config/theme';
|
|
|
import ResizeObserver from 'resize-observer-polyfill';
|
|
|
import * as echarts from 'echarts'
|
|
|
@@ -59,9 +58,7 @@ export function useEcharts() {
|
|
|
|
|
|
// 图表初始化
|
|
|
onMounted(() => {
|
|
|
- const uuid = v4();
|
|
|
const el = chartElement.value;
|
|
|
-
|
|
|
if (el) {
|
|
|
// 初始化图表
|
|
|
chart = echarts.init(el as HTMLElement);
|
|
|
@@ -80,11 +77,14 @@ export function useEcharts() {
|
|
|
}
|
|
|
})
|
|
|
|
|
|
+ // 图表重置大小
|
|
|
+ const chartResize = debounce(() => {
|
|
|
+ chart.resize && chart.resize();
|
|
|
+ }, 50);
|
|
|
+
|
|
|
// 监听元素变化
|
|
|
new ResizeObserver(() => {
|
|
|
- debounce(() => {
|
|
|
- chart.resize && chart.resize(); // 重置图表大小
|
|
|
- }, 50, uuid);
|
|
|
+ chartResize();
|
|
|
}).observe(el);
|
|
|
|
|
|
context?.emit('ready', chart);
|