diff --git a/src/packages/components/Charts/Bars/BarCommon/index.vue b/src/packages/components/Charts/Bars/BarCommon/index.vue index 238dacbd..ae4cf123 100644 --- a/src/packages/components/Charts/Bars/BarCommon/index.vue +++ b/src/packages/components/Charts/Bars/BarCommon/index.vue @@ -9,7 +9,7 @@ import { use } from 'echarts/core' import { CanvasRenderer } from 'echarts/renderers' import { BarChart } from 'echarts/charts' import config from './config' -import merge from 'lodash/merge' +import { mergeTheme } from '@/packages/public/chart' import { GridComponent, TooltipComponent, @@ -41,7 +41,9 @@ use([ TitleComponent ]) +const includes = ['title', 'legend', 'xAxis', 'yAxis'] + const option = computed(() => { - return merge(props.chartData.option, props.themeSetting) + return mergeTheme( props.chartData.option, props.themeSetting, includes) }) diff --git a/src/packages/components/Charts/Bars/BarCrossrange/config.ts b/src/packages/components/Charts/Bars/BarCrossrange/config.ts index 317a209b..8fac8b67 100644 --- a/src/packages/components/Charts/Bars/BarCrossrange/config.ts +++ b/src/packages/components/Charts/Bars/BarCrossrange/config.ts @@ -10,7 +10,6 @@ export default class Config extends publicConfig implements CreateComponentType // 图表配置项 public option = echartOptionProfixHandle({ - backgroundColor: 'rgba(0,0,0,0)', tooltip: { trigger: 'axis', axisPointer: { diff --git a/src/packages/components/Charts/Bars/BarCrossrange/index.vue b/src/packages/components/Charts/Bars/BarCrossrange/index.vue index 839514a1..e56b37d7 100644 --- a/src/packages/components/Charts/Bars/BarCrossrange/index.vue +++ b/src/packages/components/Charts/Bars/BarCrossrange/index.vue @@ -42,7 +42,7 @@ use([ ]) const option = computed(() => { - return merge(props.chartData.option, props.themeSetting) + return merge(props.themeSetting, props.chartData.option) }) diff --git a/src/packages/components/Charts/Lines/LineCommon/index.vue b/src/packages/components/Charts/Lines/LineCommon/index.vue index 19c087dd..406f058f 100644 --- a/src/packages/components/Charts/Lines/LineCommon/index.vue +++ b/src/packages/components/Charts/Lines/LineCommon/index.vue @@ -9,7 +9,7 @@ import { use, graphic } from 'echarts/core' import { CanvasRenderer } from 'echarts/renderers' import { LineChart } from 'echarts/charts' import config from './config' -import merge from 'lodash/merge' +import { mergeTheme } from '@/packages/public/chart' import { GridComponent, TooltipComponent, @@ -41,7 +41,9 @@ use([ TitleComponent ]) +const includes = ['title', 'legend', 'xAxis', 'yAxis'] + const option = computed(() => { - return merge(props.chartData.option, props.themeSetting) + return mergeTheme( props.chartData.option, props.themeSetting, includes) }) diff --git a/src/packages/components/Charts/Pies/PieCommon/config.ts b/src/packages/components/Charts/Pies/PieCommon/config.ts index c3edac24..b030fb38 100644 --- a/src/packages/components/Charts/Pies/PieCommon/config.ts +++ b/src/packages/components/Charts/Pies/PieCommon/config.ts @@ -15,7 +15,7 @@ export default class Config extends publicConfig implements CreateComponentType }, legend: { top: '5%', - left: 'center' + left: 'center', }, series: [ { diff --git a/src/packages/components/Charts/Pies/PieCommon/index.vue b/src/packages/components/Charts/Pies/PieCommon/index.vue index 3daca1dc..c9f5f584 100644 --- a/src/packages/components/Charts/Pies/PieCommon/index.vue +++ b/src/packages/components/Charts/Pies/PieCommon/index.vue @@ -8,7 +8,7 @@ import VChart from 'vue-echarts' import { use, graphic } from 'echarts/core' import { CanvasRenderer } from 'echarts/renderers' import { PieChart } from 'echarts/charts' -import merge from 'lodash/merge' +import { mergeTheme } from '@/packages/public/chart' import config from './config' import { GridComponent, @@ -41,7 +41,9 @@ use([ TitleComponent ]) +const includes = ['title', 'legend'] + const option = computed(() => { - return merge(props.chartData.option, props.themeSetting) + return mergeTheme( props.chartData.option, props.themeSetting, includes) }) diff --git a/src/packages/public/chart.ts b/src/packages/public/chart.ts index 9e9c72a2..cd71013a 100644 --- a/src/packages/public/chart.ts +++ b/src/packages/public/chart.ts @@ -1,3 +1,6 @@ +import merge from 'lodash/merge' +import pick from 'lodash/pick' + /** * * ECharts option 统一前置处理 * @param option @@ -6,3 +9,18 @@ export const echartOptionProfixHandle = (option: any) => { option['backgroundColor'] = 'rgba(0,0,0,0)' return option } + +/** + * * 合并 color 和全局配置项 + * @param option 配置 + * @param themeSetting 设置 + * @param excludes 排除元素 + * @returns object + */ +export const mergeTheme = ( + option: T, + themeSetting: U, + includes: E[] = [] +) => { + return merge(pick(themeSetting, includes), option) +}