From 3923b49c9e1c00b1a0eab853074d59aabe48be80 Mon Sep 17 00:00:00 2001 From: MTrun <1262327911@qq.com> Date: Thu, 24 Feb 2022 21:02:08 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E6=96=B0=E5=A2=9E=E6=8A=98=E7=BA=BF?= =?UTF-8?q?=E5=9B=BE=EF=BC=8C=E4=BF=AE=E6=94=B9legend=E4=BD=8D=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Charts/Lines/LineCommon/index.vue | 2 - .../Charts/Lines/LineGradientSingle/config.ts | 35 ++++++++++++++ .../Lines/LineGradientSingle/config.vue | 7 +++ .../Charts/Lines/LineGradientSingle/index.vue | 46 ++++++++++++++++--- .../Charts/Lines/LineGradients/config.ts | 40 ++++++++++++++++ .../Charts/Lines/LineGradients/config.vue | 7 +++ .../Charts/Lines/LineGradients/index.ts | 2 +- .../Charts/Lines/LineGradients/index.vue | 46 ++++++++++++++++--- .../Charts/Pies/PieCommon/config.ts | 3 +- src/packages/index.ts | 1 + src/settings/chartThemes/global.theme.json | 1 + 11 files changed, 171 insertions(+), 19 deletions(-) create mode 100644 src/packages/components/Charts/Lines/LineGradientSingle/config.ts create mode 100644 src/packages/components/Charts/Lines/LineGradientSingle/config.vue create mode 100644 src/packages/components/Charts/Lines/LineGradients/config.ts create mode 100644 src/packages/components/Charts/Lines/LineGradients/config.vue diff --git a/src/packages/components/Charts/Lines/LineCommon/index.vue b/src/packages/components/Charts/Lines/LineCommon/index.vue index 617406e1..636a00dd 100644 --- a/src/packages/components/Charts/Lines/LineCommon/index.vue +++ b/src/packages/components/Charts/Lines/LineCommon/index.vue @@ -14,7 +14,6 @@ import { GridComponent, TooltipComponent, LegendComponent, - TitleComponent } from 'echarts/components' const props = defineProps({ @@ -38,7 +37,6 @@ use([ GridComponent, TooltipComponent, LegendComponent, - TitleComponent ]) const option = computed(() => { diff --git a/src/packages/components/Charts/Lines/LineGradientSingle/config.ts b/src/packages/components/Charts/Lines/LineGradientSingle/config.ts new file mode 100644 index 00000000..8903f5a5 --- /dev/null +++ b/src/packages/components/Charts/Lines/LineGradientSingle/config.ts @@ -0,0 +1,35 @@ +import { echartOptionProfixHandle, publicConfig } from '@/packages/public' +import { LineGradientSingleConfig } from './index' +import { CreateComponentType } from '@/packages/index.d' +import omit from 'lodash/omit' + +export const includes = ['legend', 'xAxis', 'yAxis'] + +const options = echartOptionProfixHandle({ + legend: { + show: true, + }, + xAxis: { + show: true, + type: 'category', + data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] + }, + yAxis: { + show: true, + type: 'value' + }, + series: [ + { + name: 'data1', + type: 'line', + data: [120, 200, 150, 80, 70, 110, 130] + } + ] +}, includes) + +export default class Config extends publicConfig implements CreateComponentType { + public key: string = LineGradientSingleConfig.key + public chartConfig = omit(LineGradientSingleConfig, ['node']) + // 图表配置项 + public option = options +} \ No newline at end of file diff --git a/src/packages/components/Charts/Lines/LineGradientSingle/config.vue b/src/packages/components/Charts/Lines/LineGradientSingle/config.vue new file mode 100644 index 00000000..3e3b929c --- /dev/null +++ b/src/packages/components/Charts/Lines/LineGradientSingle/config.vue @@ -0,0 +1,7 @@ + + + diff --git a/src/packages/components/Charts/Lines/LineGradientSingle/index.vue b/src/packages/components/Charts/Lines/LineGradientSingle/index.vue index 850cdeef..636a00dd 100644 --- a/src/packages/components/Charts/Lines/LineGradientSingle/index.vue +++ b/src/packages/components/Charts/Lines/LineGradientSingle/index.vue @@ -1,13 +1,45 @@ - - \ No newline at end of file diff --git a/src/packages/components/Charts/Lines/LineGradients/config.ts b/src/packages/components/Charts/Lines/LineGradients/config.ts new file mode 100644 index 00000000..cd81b856 --- /dev/null +++ b/src/packages/components/Charts/Lines/LineGradients/config.ts @@ -0,0 +1,40 @@ +import { echartOptionProfixHandle, publicConfig } from '@/packages/public' +import { LineGradientsConfig } from './index' +import { CreateComponentType } from '@/packages/index.d' +import omit from 'lodash/omit' + +export const includes = ['legend', 'xAxis', 'yAxis'] + +const options = echartOptionProfixHandle({ + legend: { + show: true, + }, + xAxis: { + show: true, + type: 'category', + data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] + }, + yAxis: { + show: true, + type: 'value' + }, + series: [ + { + name: 'data1', + type: 'line', + data: [120, 200, 150, 80, 70, 110, 130] + }, + { + name: 'data2', + type: 'line', + data: [130, 130, 312, 268, 155, 117, 160] + } + ] +}, includes) + +export default class Config extends publicConfig implements CreateComponentType { + public key: string = LineGradientsConfig.key + public chartConfig = omit(LineGradientsConfig, ['node']) + // 图表配置项 + public option = options +} \ No newline at end of file diff --git a/src/packages/components/Charts/Lines/LineGradients/config.vue b/src/packages/components/Charts/Lines/LineGradients/config.vue new file mode 100644 index 00000000..3e3b929c --- /dev/null +++ b/src/packages/components/Charts/Lines/LineGradients/config.vue @@ -0,0 +1,7 @@ + + + diff --git a/src/packages/components/Charts/Lines/LineGradients/index.ts b/src/packages/components/Charts/Lines/LineGradients/index.ts index f17d72c0..ca8e300f 100644 --- a/src/packages/components/Charts/Lines/LineGradients/index.ts +++ b/src/packages/components/Charts/Lines/LineGradients/index.ts @@ -4,7 +4,7 @@ import { ConfigType, PackagesCategoryEnum } from '@/packages/index.d' import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d' export const LineGradientsConfig: ConfigType = { - key: 'VLineGradientSingle', + key: 'VLineGradients', title: '折线面积图', category: ChatCategoryEnum.LINE, categoryName: ChatCategoryEnumName.LINE, diff --git a/src/packages/components/Charts/Lines/LineGradients/index.vue b/src/packages/components/Charts/Lines/LineGradients/index.vue index 850cdeef..636a00dd 100644 --- a/src/packages/components/Charts/Lines/LineGradients/index.vue +++ b/src/packages/components/Charts/Lines/LineGradients/index.vue @@ -1,13 +1,45 @@ - - \ No newline at end of file diff --git a/src/packages/components/Charts/Pies/PieCommon/config.ts b/src/packages/components/Charts/Pies/PieCommon/config.ts index 1bd77aa3..db634dd1 100644 --- a/src/packages/components/Charts/Pies/PieCommon/config.ts +++ b/src/packages/components/Charts/Pies/PieCommon/config.ts @@ -12,14 +12,13 @@ const option = echartOptionProfixHandle({ }, legend: { show: true, - top: '5%', - left: 'center' }, series: [ { name: 'Access From', type: 'pie', radius: ['40%', '70%'], + center: ['50%', '60%'], avoidLabelOverlap: false, itemStyle: { show: true, diff --git a/src/packages/index.ts b/src/packages/index.ts index 0944c272..4fb919de 100644 --- a/src/packages/index.ts +++ b/src/packages/index.ts @@ -32,6 +32,7 @@ const packagesInstall = (app: App): void => { * @param dropData */ const createComponent = async (dropData: ConfigType) => { + console.log(dropData) const { category } = dropData const key = dropData.key.substring(1) const chart = await import(`./components/${dropData.package}/${category}/${key}/config.ts`) diff --git a/src/settings/chartThemes/global.theme.json b/src/settings/chartThemes/global.theme.json index b758af68..33e84035 100644 --- a/src/settings/chartThemes/global.theme.json +++ b/src/settings/chartThemes/global.theme.json @@ -62,6 +62,7 @@ } }, "legend": { + "top": "5%", "textStyle": { "color": "#B9B8CE" }