perf: 优化内存泄漏问题

This commit is contained in:
奔跑的面条 2023-02-15 09:20:48 +08:00
parent c87a8a1da9
commit 5ee5c0fd58
7 changed files with 25 additions and 11 deletions

View File

@ -6,6 +6,7 @@ import { CreateComponentType, ChartFrameEnum } from '@/packages/index.d'
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore' import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
import { RequestDataTypeEnum } from '@/enums/httpEnum' import { RequestDataTypeEnum } from '@/enums/httpEnum'
import { isPreview, newFunctionHandle, intervalUnitHandle } from '@/utils' import { isPreview, newFunctionHandle, intervalUnitHandle } from '@/utils'
import { setOption } from '@/packages/public/chart'
// 获取类型 // 获取类型
type ChartEditStoreType = typeof useChartEditStore type ChartEditStoreType = typeof useChartEditStore
@ -34,7 +35,7 @@ export const useChartDataFetch = (
const echartsUpdateHandle = (dataset: any) => { const echartsUpdateHandle = (dataset: any) => {
if (chartFrame === ChartFrameEnum.ECHARTS) { if (chartFrame === ChartFrameEnum.ECHARTS) {
if (vChartRef.value) { if (vChartRef.value) {
vChartRef.value.setOption({ dataset: dataset }) setOption(vChartRef.value, { dataset: dataset })
} }
} }
} }

View File

@ -11,7 +11,7 @@ import { use, registerMap } from 'echarts/core'
import { EffectScatterChart, MapChart } from 'echarts/charts' import { EffectScatterChart, MapChart } from 'echarts/charts'
import { CanvasRenderer } from 'echarts/renderers' import { CanvasRenderer } from 'echarts/renderers'
import { useChartDataFetch } from '@/hooks' import { useChartDataFetch } from '@/hooks'
import { mergeTheme } from '@/packages/public/chart' import { mergeTheme, setOption } from '@/packages/public/chart'
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore' import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
import { isPreview } from '@/utils' import { isPreview } from '@/utils'
import mapJsonWithoutHainanIsLands from './mapWithoutHainanIsLands.json' import mapJsonWithoutHainanIsLands from './mapWithoutHainanIsLands.json'
@ -76,7 +76,7 @@ registerMapInitAsync()
// //
const vEchartsSetOption = () => { const vEchartsSetOption = () => {
option.value = props.chartConfig.option option.value = props.chartConfig.option
vChartRef.value?.setOption(props.chartConfig.option) setOption(vChartRef.value, props.chartConfig.option)
} }
// //

View File

@ -10,7 +10,7 @@ import { use } from 'echarts/core'
import { CanvasRenderer } from 'echarts/renderers' import { CanvasRenderer } from 'echarts/renderers'
import { HeatmapChart } from 'echarts/charts' import { HeatmapChart } from 'echarts/charts'
import { includes } from './config' import { includes } from './config'
import { mergeTheme } from '@/packages/public/chart' import { mergeTheme, setOption } from '@/packages/public/chart'
import { useChartDataFetch } from '@/hooks' import { useChartDataFetch } from '@/hooks'
import { CreateComponentType } from '@/packages/index.d' import { CreateComponentType } from '@/packages/index.d'
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore' import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
@ -68,7 +68,7 @@ const dataSetHandle = (dataset: typeof dataJson) => {
props.chartConfig.option.series[0].data = seriesData props.chartConfig.option.series[0].data = seriesData
} }
if (vChartRef.value && isPreview()) { if (vChartRef.value && isPreview()) {
vChartRef.value.setOption(props.chartConfig.option) setOption(vChartRef.value, props.chartConfig.option)
} }
} }

View File

@ -10,7 +10,7 @@ import { use } from 'echarts/core'
import { CanvasRenderer } from 'echarts/renderers' import { CanvasRenderer } from 'echarts/renderers'
import { RadarChart } from 'echarts/charts' import { RadarChart } from 'echarts/charts'
import { includes } from './config' import { includes } from './config'
import { mergeTheme } from '@/packages/public/chart' import { mergeTheme, setOption } from '@/packages/public/chart'
import { useChartDataFetch } from '@/hooks' import { useChartDataFetch } from '@/hooks'
import { CreateComponentType } from '@/packages/index.d' import { CreateComponentType } from '@/packages/index.d'
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore' import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
@ -50,7 +50,7 @@ const dataSetHandle = (dataset: typeof dataJson) => {
props.chartConfig.option.radar.indicator = dataset.radarIndicator props.chartConfig.option.radar.indicator = dataset.radarIndicator
} }
if (vChartRef.value && isPreview()) { if (vChartRef.value && isPreview()) {
vChartRef.value.setOption(props.chartConfig.option) setOption(vChartRef.value, props.chartConfig.option)
} }
} }

View File

@ -10,7 +10,7 @@ import { use } from 'echarts/core'
import { CanvasRenderer } from 'echarts/renderers' import { CanvasRenderer } from 'echarts/renderers'
import { TreemapChart } from 'echarts/charts' import { TreemapChart } from 'echarts/charts'
import { includes } from './config' import { includes } from './config'
import { mergeTheme } from '@/packages/public/chart' import { mergeTheme, setOption } from '@/packages/public/chart'
import { useChartDataFetch } from '@/hooks' import { useChartDataFetch } from '@/hooks'
import { CreateComponentType } from '@/packages/index.d' import { CreateComponentType } from '@/packages/index.d'
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore' import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
@ -42,7 +42,7 @@ const option = computed(() => {
const dataSetHandle = (dataset: typeof dataJson) => { const dataSetHandle = (dataset: typeof dataJson) => {
if (dataset) { if (dataset) {
props.chartConfig.option.series[0].data = dataset props.chartConfig.option.series[0].data = dataset
vChartRef.value?.setOption(props.chartConfig.option) setOption(vChartRef.value, props.chartConfig.option)
} }
} }

View File

@ -16,7 +16,7 @@ import 'echarts-wordcloud'
import { use } from 'echarts/core' import { use } from 'echarts/core'
import { CanvasRenderer } from 'echarts/renderers' import { CanvasRenderer } from 'echarts/renderers'
import config, { includes } from './config' import config, { includes } from './config'
import { mergeTheme } from '@/packages/public/chart' import { mergeTheme, setOption } from '@/packages/public/chart'
import { useChartDataFetch } from '@/hooks' import { useChartDataFetch } from '@/hooks'
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore' import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
import { isPreview } from '@/utils' import { isPreview } from '@/utils'
@ -49,7 +49,7 @@ const option = computed(() => {
const dataSetHandle = (dataset: typeof dataJson) => { const dataSetHandle = (dataset: typeof dataJson) => {
try { try {
dataset && (props.chartConfig.option.series[0].data = dataset) dataset && (props.chartConfig.option.series[0].data = dataset)
vChartRef.value && isPreview() && vChartRef.value.setOption(props.chartConfig.option) vChartRef.value && isPreview() && setOption(vChartRef.value, props.chartConfig.option)
} catch (error) { } catch (error) {
console.log(error) console.log(error)
} }

View File

@ -2,6 +2,7 @@ import merge from 'lodash/merge'
import pick from 'lodash/pick' import pick from 'lodash/pick'
import { EchartsDataType } from '../index.d' import { EchartsDataType } from '../index.d'
import { globalThemeJson } from '@/settings/chartThemes/index' import { globalThemeJson } from '@/settings/chartThemes/index'
import type VChart from 'vue-echarts'
/** /**
* * color * * color
@ -33,3 +34,15 @@ export const setData = (option: any, data: EchartsDataType) => {
option.dataset = data option.dataset = data
return option return option
} }
/**
* * setOption
* @param instance
* @param data
*/
export const setOption = <T extends typeof VChart | undefined, D>(instance: T, data: D) => {
if (!instance) return
const option = instance.getOption()
option.dataset = null
instance.setOption(data)
}