From d835a904c907dec00a8a528ca3f50abca66c7583 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A5=94=E8=B7=91=E7=9A=84=E9=9D=A2=E6=9D=A1?=
<1262327911@qq.com>
Date: Fri, 14 Oct 2022 14:33:14 +0800
Subject: [PATCH 1/5] =?UTF-8?q?fix:=20=E8=A7=A3=E5=86=B3=E5=AF=BC=E5=85=A5?=
=?UTF-8?q?=E6=97=B6=E9=A1=BA=E5=BA=8F=E4=B8=8D=E5=AF=B9=E7=9A=84=E9=97=AE?=
=?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/views/chart/hooks/useSync.hook.ts | 65 ++++++++++++++-------------
1 file changed, 33 insertions(+), 32 deletions(-)
diff --git a/src/views/chart/hooks/useSync.hook.ts b/src/views/chart/hooks/useSync.hook.ts
index 9bf70564..9dd410a9 100644
--- a/src/views/chart/hooks/useSync.hook.ts
+++ b/src/views/chart/hooks/useSync.hook.ts
@@ -18,7 +18,7 @@ const componentMerge = (object: any, sources: any, notComponent = false) => {
if (notComponent) return merge(object, sources)
// 组件排除 options
const option = sources.option
- if(!option) return merge(object, sources)
+ if (!option) return merge(object, sources)
// 为 undefined 的 sources 来源对象属性将被跳过详见 https://www.lodashjs.com/docs/lodash.merge
sources.option = undefined
@@ -66,37 +66,38 @@ export const useSync = () => {
intComponent(e as CreateComponentType)
}
})
+
+ // 创建函数-重新创建是为了处理类种方法消失的问题
+ const create = async (
+ _componentInstance: CreateComponentType,
+ callBack?: (componentInstance: CreateComponentType) => void
+ ) => {
+ // 补充 class 上的方法
+ let newComponent: CreateComponentType = await createComponent(_componentInstance.chartConfig)
+ if (callBack) {
+ if (changeId) {
+ callBack(componentMerge(newComponent, { ..._componentInstance, id: getUUID() }))
+ } else {
+ callBack(componentMerge(newComponent, _componentInstance))
+ }
+ } else {
+ if (changeId) {
+ chartEditStore.addComponentList(
+ componentMerge(newComponent, { ..._componentInstance, id: getUUID() }),
+ false,
+ true
+ )
+ } else {
+ chartEditStore.addComponentList(componentMerge(newComponent, _componentInstance), false, true)
+ }
+ }
+ }
+
// 数据赋值
for (const key in projectData) {
// 组件
if (key === ChartEditStoreEnum.COMPONENT_LIST) {
for (const comItem of projectData[key]) {
- // 重新创建是为了处理类种方法消失的问题
- const create = async (
- _componentInstance: CreateComponentType,
- callBack?: (componentInstance: CreateComponentType) => void
- ) => {
- // 补充 class 上的方法
- let newComponent: CreateComponentType = await createComponent(_componentInstance.chartConfig)
- if (callBack) {
- if (changeId) {
- callBack(componentMerge(newComponent, { ..._componentInstance, id: getUUID() }))
- } else {
- callBack(componentMerge(newComponent, _componentInstance))
- }
- } else {
- if (changeId) {
- chartEditStore.addComponentList(
- componentMerge(newComponent, { ..._componentInstance, id: getUUID() }),
- false,
- true
- )
- } else {
- chartEditStore.addComponentList(componentMerge(newComponent, _componentInstance), false, true)
- }
- }
- }
-
if (comItem.isGroup) {
// 创建分组
let groupClass = new PublicGroupConfigClass()
@@ -106,19 +107,19 @@ export const useSync = () => {
groupClass = componentMerge(groupClass, comItem)
}
- // 注册子应用
+ // 异步注册子应用
const targetList: CreateComponentType[] = []
- ;(comItem as CreateComponentGroupType).groupList.forEach(groupItem => {
- create(groupItem, e => {
+ for (const groupItem of (comItem as CreateComponentGroupType).groupList) {
+ await create(groupItem, e => {
targetList.push(e)
})
- })
+ }
groupClass.groupList = targetList
// 分组插入到列表
chartEditStore.addComponentList(groupClass, false, true)
} else {
- create(comItem as CreateComponentType)
+ await create(comItem as CreateComponentType)
}
}
} else {
From 2a6e5915f5ce76a3ed007490bb8094cfa2253fab Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=92=8B=E6=89=BF?= <1141845963@qq.com>
Date: Fri, 14 Oct 2022 16:46:41 +0800
Subject: [PATCH 2/5] =?UTF-8?q?feat:=20=E6=9F=B1=E7=8A=B6=E5=9B=BE?=
=?UTF-8?q?=E6=8A=98=E7=BA=BF=E5=9B=BE=E6=B7=BB=E5=8A=A0=E7=BD=91=E6=A0=BC?=
=?UTF-8?q?=E9=85=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../Pages/ChartItemSetting/GlobalSetting.vue | 24 +++++++++++++++++++
.../Charts/Bars/BarCommon/config.ts | 15 ++++++++----
.../Charts/Bars/BarCrossrange/config.ts | 9 ++++++-
.../Charts/Lines/LineCommon/config.ts | 13 +++++++---
.../Charts/Lines/LineGradientSingle/config.ts | 22 ++++++++++-------
.../Charts/Lines/LineGradients/config.ts | 11 +++++++--
.../Charts/Lines/LineLinearSingle/config.ts | 11 +++++++--
src/settings/chartThemes/global.theme.json | 7 ++++++
8 files changed, 92 insertions(+), 20 deletions(-)
diff --git a/src/components/Pages/ChartItemSetting/GlobalSetting.vue b/src/components/Pages/ChartItemSetting/GlobalSetting.vue
index f6941671..23be4316 100644
--- a/src/components/Pages/ChartItemSetting/GlobalSetting.vue
+++ b/src/components/Pages/ChartItemSetting/GlobalSetting.vue
@@ -210,6 +210,26 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -289,6 +309,10 @@ const legend = computed(() => {
return props.optionData.legend
})
+const grid = computed(() => {
+ return props.optionData.grid
+})
+
const visualMap = computed(() => {
return props.optionData.visualMap
})
diff --git a/src/packages/components/Charts/Bars/BarCommon/config.ts b/src/packages/components/Charts/Bars/BarCommon/config.ts
index b9cd9513..8bf2c909 100644
--- a/src/packages/components/Charts/Bars/BarCommon/config.ts
+++ b/src/packages/components/Charts/Bars/BarCommon/config.ts
@@ -4,15 +4,15 @@ import { CreateComponentType } from '@/packages/index.d'
import cloneDeep from 'lodash/cloneDeep'
import dataJson from './data.json'
-export const includes = ['legend', 'xAxis', 'yAxis']
+export const includes = ['legend', 'xAxis', 'yAxis', 'grid']
export const seriesItem = {
type: 'bar',
barWidth: 15,
- label:{
+ label: {
show: true,
position: 'top',
- color: "#fff",
- fontSize: 12,
+ color: '#fff',
+ fontSize: 12
},
itemStyle: {
color: null,
@@ -31,6 +31,13 @@ export const option = {
legend: {
show: true
},
+ grid: {
+ show: false,
+ left: '10%',
+ top: '60',
+ right: '10%',
+ bottom: '60'
+ },
xAxis: {
show: true,
type: 'category'
diff --git a/src/packages/components/Charts/Bars/BarCrossrange/config.ts b/src/packages/components/Charts/Bars/BarCrossrange/config.ts
index f2a7214c..39314420 100644
--- a/src/packages/components/Charts/Bars/BarCrossrange/config.ts
+++ b/src/packages/components/Charts/Bars/BarCrossrange/config.ts
@@ -4,7 +4,7 @@ import { CreateComponentType } from '@/packages/index.d'
import cloneDeep from 'lodash/cloneDeep'
import dataJson from './data.json'
-export const includes = ['legend', 'xAxis', 'yAxis']
+export const includes = ['legend', 'xAxis', 'yAxis', 'grid']
export const seriesItem = {
type: 'bar',
barWidth: null,
@@ -31,6 +31,13 @@ export const option = {
legend: {
show: true
},
+ grid: {
+ show: false,
+ left: '10%',
+ top: '60',
+ right: '10%',
+ bottom: '60'
+ },
xAxis: {
show: true,
type: 'value'
diff --git a/src/packages/components/Charts/Lines/LineCommon/config.ts b/src/packages/components/Charts/Lines/LineCommon/config.ts
index 22a22ed4..b069f522 100644
--- a/src/packages/components/Charts/Lines/LineCommon/config.ts
+++ b/src/packages/components/Charts/Lines/LineCommon/config.ts
@@ -4,7 +4,7 @@ import { CreateComponentType } from '@/packages/index.d'
import { defaultTheme, chartColorsSearch } from '@/settings/chartThemes/index'
import dataJson from './data.json'
-export const includes = ['legend', 'xAxis', 'yAxis']
+export const includes = ['legend', 'xAxis', 'yAxis', 'grid']
export const seriesItem = {
type: 'line',
label: {
@@ -13,7 +13,7 @@ export const seriesItem = {
color: '#fff',
fontSize: 12
},
- symbolSize: 5, //设定实心点的大小
+ symbolSize: 5, //设定实心点的大小
itemStyle: {
color: null,
borderRadius: 0
@@ -21,7 +21,7 @@ export const seriesItem = {
lineStyle: {
type: 'solid',
width: 3,
- color: null,
+ color: null
}
}
@@ -36,6 +36,13 @@ export const option = {
legend: {
show: true
},
+ grid: {
+ show: false,
+ left: '10%',
+ top: '60',
+ right: '10%',
+ bottom: '60'
+ },
xAxis: {
show: true,
type: 'category'
diff --git a/src/packages/components/Charts/Lines/LineGradientSingle/config.ts b/src/packages/components/Charts/Lines/LineGradientSingle/config.ts
index 021cdd00..534592a7 100644
--- a/src/packages/components/Charts/Lines/LineGradientSingle/config.ts
+++ b/src/packages/components/Charts/Lines/LineGradientSingle/config.ts
@@ -5,7 +5,7 @@ import { graphic } from 'echarts/core'
import { defaultTheme, chartColorsSearch } from '@/settings/chartThemes/index'
import dataJson from './data.json'
-export const includes = ['legend', 'xAxis', 'yAxis']
+export const includes = ['legend', 'xAxis', 'yAxis', 'grid']
const options = {
tooltip: {
@@ -18,9 +18,16 @@ const options = {
legend: {
show: true
},
+ grid: {
+ show: false,
+ left: '10%',
+ top: '60',
+ right: '10%',
+ bottom: '60'
+ },
xAxis: {
show: true,
- type: 'category',
+ type: 'category'
},
yAxis: {
show: true,
@@ -31,12 +38,12 @@ const options = {
{
type: 'line',
smooth: false,
- symbolSize: 5, //设定实心点的大小
- label:{
+ symbolSize: 5, //设定实心点的大小
+ label: {
show: true,
position: 'top',
- color: "#fff",
- fontSize: 12,
+ color: '#fff',
+ fontSize: 12
},
lineStyle: {
type: 'solid',
@@ -59,8 +66,7 @@ const options = {
]
}
-export default class Config extends PublicConfigClass
- implements CreateComponentType {
+export default class Config extends PublicConfigClass implements CreateComponentType {
public key: string = LineGradientSingleConfig.key
public chartConfig = LineGradientSingleConfig
// 图表配置项
diff --git a/src/packages/components/Charts/Lines/LineGradients/config.ts b/src/packages/components/Charts/Lines/LineGradients/config.ts
index 838b841f..a3e35ccc 100644
--- a/src/packages/components/Charts/Lines/LineGradients/config.ts
+++ b/src/packages/components/Charts/Lines/LineGradients/config.ts
@@ -5,12 +5,19 @@ import { graphic } from 'echarts/core'
import { defaultTheme, chartColorsSearch } from '@/settings/chartThemes/index'
import dataJson from './data.json'
-export const includes = ['legend', 'xAxis', 'yAxis']
+export const includes = ['legend', 'xAxis', 'yAxis', 'grid']
const option = {
legend: {
show: true
},
+ grid: {
+ show: false,
+ left: '10%',
+ top: '60',
+ right: '10%',
+ bottom: '60'
+ },
tooltip: {
show: true,
trigger: 'axis',
@@ -31,7 +38,7 @@ const option = {
{
type: 'line',
smooth: false,
- symbolSize: 5, //设定实心点的大小
+ symbolSize: 5, //设定实心点的大小
label: {
show: true,
position: 'top',
diff --git a/src/packages/components/Charts/Lines/LineLinearSingle/config.ts b/src/packages/components/Charts/Lines/LineLinearSingle/config.ts
index 4a5be6c4..efe0d0ca 100644
--- a/src/packages/components/Charts/Lines/LineLinearSingle/config.ts
+++ b/src/packages/components/Charts/Lines/LineLinearSingle/config.ts
@@ -4,7 +4,7 @@ import { CreateComponentType } from '@/packages/index.d'
import { defaultTheme, chartColorsSearch } from '@/settings/chartThemes/index'
import dataJson from './data.json'
-export const includes = ['legend', 'xAxis', 'yAxis']
+export const includes = ['legend', 'xAxis', 'yAxis', 'grid']
export const option = {
tooltip: {
@@ -17,6 +17,13 @@ export const option = {
legend: {
show: true
},
+ grid: {
+ show: false,
+ left: '10%',
+ top: '60',
+ right: '10%',
+ bottom: '60'
+ },
xAxis: {
show: true,
type: 'category'
@@ -29,7 +36,7 @@ export const option = {
series: [
{
type: 'line',
- symbolSize: 5, //设定实心点的大小
+ symbolSize: 5, //设定实心点的大小
lineStyle: {
type: 'solid',
width: 3,
diff --git a/src/settings/chartThemes/global.theme.json b/src/settings/chartThemes/global.theme.json
index 9991b72f..491b3e4a 100644
--- a/src/settings/chartThemes/global.theme.json
+++ b/src/settings/chartThemes/global.theme.json
@@ -88,5 +88,12 @@
"textStyle": {
"color": "#B9B8CE"
}
+ },
+ "grid": {
+ "show": false,
+ "left": "10%",
+ "top": "60",
+ "right": "10%",
+ "bottom": "60"
}
}
\ No newline at end of file
From 2d94085c549263d79a03b724eb8948d8ac5d289b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=92=8B=E6=89=BF?= <1141845963@qq.com>
Date: Fri, 14 Oct 2022 16:50:06 +0800
Subject: [PATCH 3/5] =?UTF-8?q?feat:=20=E7=BD=91=E6=A0=BC=E5=AE=B9?=
=?UTF-8?q?=E5=99=A8=E9=85=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../Pages/ChartItemSetting/GlobalSetting.vue | 11 ++++-------
1 file changed, 4 insertions(+), 7 deletions(-)
diff --git a/src/components/Pages/ChartItemSetting/GlobalSetting.vue b/src/components/Pages/ChartItemSetting/GlobalSetting.vue
index 23be4316..6a313877 100644
--- a/src/components/Pages/ChartItemSetting/GlobalSetting.vue
+++ b/src/components/Pages/ChartItemSetting/GlobalSetting.vue
@@ -211,25 +211,22 @@
-
-
-
-
+
-
+
-
+
-
+
From c75d9f7a5954ceb499f81c6dbbfac9c2ce9b0bfc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=92=8B=E6=89=BF?= <1141845963@qq.com>
Date: Fri, 14 Oct 2022 17:09:26 +0800
Subject: [PATCH 4/5] =?UTF-8?q?feat:=20x,y=E8=BD=B4=E6=A0=87=E7=AD=BE?=
=?UTF-8?q?=E5=81=8F=E7=A7=BB=E9=87=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/components/Pages/ChartItemSetting/GlobalSetting.vue | 6 ++++++
src/settings/chartThemes/global.theme.json | 6 ++++--
2 files changed, 10 insertions(+), 2 deletions(-)
diff --git a/src/components/Pages/ChartItemSetting/GlobalSetting.vue b/src/components/Pages/ChartItemSetting/GlobalSetting.vue
index 6a313877..1dbca006 100644
--- a/src/components/Pages/ChartItemSetting/GlobalSetting.vue
+++ b/src/components/Pages/ChartItemSetting/GlobalSetting.vue
@@ -51,6 +51,9 @@
+
+
+
@@ -140,6 +143,9 @@
+
+
+
diff --git a/src/settings/chartThemes/global.theme.json b/src/settings/chartThemes/global.theme.json
index 491b3e4a..1c099af8 100644
--- a/src/settings/chartThemes/global.theme.json
+++ b/src/settings/chartThemes/global.theme.json
@@ -22,7 +22,8 @@
"axisLabel": {
"show": true,
"fontSize": 12,
- "color": "#B9B8CE"
+ "color": "#B9B8CE",
+ "rotate": 0
},
"position": "bottom",
"axisLine": {
@@ -58,7 +59,8 @@
"axisLabel": {
"show": true,
"fontSize": 12,
- "color": "#B9B8CE"
+ "color": "#B9B8CE",
+ "rotate": 0
},
"position": "left",
"axisLine": {
From 59cb5d609d2679d95302a8af2ff62128ba28bbae Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A5=94=E8=B7=91=E7=9A=84=E9=9D=A2=E6=9D=A1?=
<1262327911@qq.com>
Date: Sat, 15 Oct 2022 16:51:16 +0800
Subject: [PATCH 5/5] =?UTF-8?q?perf:=20=E5=8E=BB=E9=99=A4grid=E5=A4=9A?=
=?UTF-8?q?=E4=BD=99=E9=85=8D=E7=BD=AE=EF=BC=8C=E6=B7=BB=E5=8A=A0=E6=95=A3?=
=?UTF-8?q?=E7=82=B9=E5=9B=BE=E3=80=81=E7=83=AD=E5=8A=9B=E5=9B=BE=E7=9A=84?=
=?UTF-8?q?grid?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../Pages/ChartItemSetting/GlobalSetting.vue | 34 +++++++++----------
.../Charts/Bars/BarCommon/config.ts | 12 +------
.../Charts/Bars/BarCrossrange/config.ts | 10 ------
.../Charts/Lines/LineCommon/config.ts | 10 ------
.../Charts/Lines/LineGradientSingle/config.ts | 10 ------
.../Charts/Lines/LineGradients/config.ts | 10 ------
.../Charts/Lines/LineLinearSingle/config.ts | 10 ------
.../components/Charts/Mores/Heatmap/config.ts | 2 +-
.../Charts/Scatters/ScatterCommon/config.ts | 2 +-
.../ScatterLogarithmicRegression/config.ts | 2 +-
10 files changed, 21 insertions(+), 81 deletions(-)
diff --git a/src/components/Pages/ChartItemSetting/GlobalSetting.vue b/src/components/Pages/ChartItemSetting/GlobalSetting.vue
index 1dbca006..35a74235 100644
--- a/src/components/Pages/ChartItemSetting/GlobalSetting.vue
+++ b/src/components/Pages/ChartItemSetting/GlobalSetting.vue
@@ -21,6 +21,23 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -216,23 +233,6 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/packages/components/Charts/Bars/BarCommon/config.ts b/src/packages/components/Charts/Bars/BarCommon/config.ts
index 8bf2c909..a57b6d94 100644
--- a/src/packages/components/Charts/Bars/BarCommon/config.ts
+++ b/src/packages/components/Charts/Bars/BarCommon/config.ts
@@ -28,17 +28,7 @@ export const option = {
type: 'shadow'
}
},
- legend: {
- show: true
- },
- grid: {
- show: false,
- left: '10%',
- top: '60',
- right: '10%',
- bottom: '60'
- },
- xAxis: {
+xAxis: {
show: true,
type: 'category'
},
diff --git a/src/packages/components/Charts/Bars/BarCrossrange/config.ts b/src/packages/components/Charts/Bars/BarCrossrange/config.ts
index 39314420..340656ac 100644
--- a/src/packages/components/Charts/Bars/BarCrossrange/config.ts
+++ b/src/packages/components/Charts/Bars/BarCrossrange/config.ts
@@ -28,16 +28,6 @@ export const option = {
type: 'shadow'
}
},
- legend: {
- show: true
- },
- grid: {
- show: false,
- left: '10%',
- top: '60',
- right: '10%',
- bottom: '60'
- },
xAxis: {
show: true,
type: 'value'
diff --git a/src/packages/components/Charts/Lines/LineCommon/config.ts b/src/packages/components/Charts/Lines/LineCommon/config.ts
index b069f522..5b275ba0 100644
--- a/src/packages/components/Charts/Lines/LineCommon/config.ts
+++ b/src/packages/components/Charts/Lines/LineCommon/config.ts
@@ -33,16 +33,6 @@ export const option = {
type: 'line'
}
},
- legend: {
- show: true
- },
- grid: {
- show: false,
- left: '10%',
- top: '60',
- right: '10%',
- bottom: '60'
- },
xAxis: {
show: true,
type: 'category'
diff --git a/src/packages/components/Charts/Lines/LineGradientSingle/config.ts b/src/packages/components/Charts/Lines/LineGradientSingle/config.ts
index 534592a7..dea1397a 100644
--- a/src/packages/components/Charts/Lines/LineGradientSingle/config.ts
+++ b/src/packages/components/Charts/Lines/LineGradientSingle/config.ts
@@ -15,16 +15,6 @@ const options = {
type: 'line'
}
},
- legend: {
- show: true
- },
- grid: {
- show: false,
- left: '10%',
- top: '60',
- right: '10%',
- bottom: '60'
- },
xAxis: {
show: true,
type: 'category'
diff --git a/src/packages/components/Charts/Lines/LineGradients/config.ts b/src/packages/components/Charts/Lines/LineGradients/config.ts
index a3e35ccc..2037ce5f 100644
--- a/src/packages/components/Charts/Lines/LineGradients/config.ts
+++ b/src/packages/components/Charts/Lines/LineGradients/config.ts
@@ -8,16 +8,6 @@ import dataJson from './data.json'
export const includes = ['legend', 'xAxis', 'yAxis', 'grid']
const option = {
- legend: {
- show: true
- },
- grid: {
- show: false,
- left: '10%',
- top: '60',
- right: '10%',
- bottom: '60'
- },
tooltip: {
show: true,
trigger: 'axis',
diff --git a/src/packages/components/Charts/Lines/LineLinearSingle/config.ts b/src/packages/components/Charts/Lines/LineLinearSingle/config.ts
index efe0d0ca..fbeb875f 100644
--- a/src/packages/components/Charts/Lines/LineLinearSingle/config.ts
+++ b/src/packages/components/Charts/Lines/LineLinearSingle/config.ts
@@ -14,16 +14,6 @@ export const option = {
type: 'line'
}
},
- legend: {
- show: true
- },
- grid: {
- show: false,
- left: '10%',
- top: '60',
- right: '10%',
- bottom: '60'
- },
xAxis: {
show: true,
type: 'category'
diff --git a/src/packages/components/Charts/Mores/Heatmap/config.ts b/src/packages/components/Charts/Mores/Heatmap/config.ts
index 8e8cc6f6..089cfcc4 100644
--- a/src/packages/components/Charts/Mores/Heatmap/config.ts
+++ b/src/packages/components/Charts/Mores/Heatmap/config.ts
@@ -4,7 +4,7 @@ import { CreateComponentType } from '@/packages/index.d'
import { cloneDeep } from 'lodash'
import dataJson from './data.json'
-export const includes = ['xAxis', 'yAxis']
+export const includes = ['xAxis', 'yAxis', 'grid']
export const option = {
dataset: { ...dataJson },
diff --git a/src/packages/components/Charts/Scatters/ScatterCommon/config.ts b/src/packages/components/Charts/Scatters/ScatterCommon/config.ts
index bd9d0da0..e0a847ec 100644
--- a/src/packages/components/Charts/Scatters/ScatterCommon/config.ts
+++ b/src/packages/components/Charts/Scatters/ScatterCommon/config.ts
@@ -4,7 +4,7 @@ import { CreateComponentType } from '@/packages/index.d'
import cloneDeep from 'lodash/cloneDeep'
import dataJson from './data.json'
-export const includes = ['legend', 'xAxis', 'yAxis']
+export const includes = ['legend', 'xAxis', 'yAxis', 'grid']
export const seriesItem = {
type: 'scatter',
diff --git a/src/packages/components/Charts/Scatters/ScatterLogarithmicRegression/config.ts b/src/packages/components/Charts/Scatters/ScatterLogarithmicRegression/config.ts
index 136d384c..c1902a85 100644
--- a/src/packages/components/Charts/Scatters/ScatterLogarithmicRegression/config.ts
+++ b/src/packages/components/Charts/Scatters/ScatterLogarithmicRegression/config.ts
@@ -4,7 +4,7 @@ import { CreateComponentType } from '@/packages/index.d'
import cloneDeep from 'lodash/cloneDeep'
import dataJson from './data.json'
-export const includes = ['legend', 'xAxis', 'yAxis']
+export const includes = ['legend', 'xAxis', 'yAxis', 'grid']
export const option = {
dataset: dataJson,