chartDesigner无chartOption时修改样式不生成chartOption

src/components/chart/resolveChartThumbnailOption.js

@@ -6,6 +6,9 @@
  * @param option: Object 图表配置档
  */
 export default (option) => {
+    if(!option || ((!option.series || option.series.length === 0) && (!option.baseOption || !option.baseOption.series || option.baseOption.series.length === 0))) {
+        return;
+    }
     let _option = !!option.baseOption ? { ...option.baseOption } : { ...option };
     let viewType = _option.series ? (_option.series[0].type) : null;
 
@@ -29,79 +32,50 @@ export default (option) => {
             normal: { show: false }
         },
     })) : _option.series;
+    // X轴
+    _option.xAxis ? (_option.xAxis.length > 0 ? _option.xAxis[0].name = '' : ( _option.xAxis.name = '' ) ) : _option.xAxis = { name: '' };
+    _option.xAxis ? (_option.xAxis.length > 0 ? (
+        _option.xAxis[0].axisLabel = {
+            ..._option.xAxis[0].axisLabel,
+            show: false,
+        }
+    ) : (
+        _option.xAxis.axisLabel = {
+            ..._option.xAxis.axisLabel,
+            show: false,
+        }
+    )) : _option.xAxis = {
+        axisLabel: {
+            show: false,
+        } 
+    };
+    // y轴
+    _option.yAxis ? (_option.yAxis.length > 0 ? _option.yAxis[0].name = '' : ( _option.yAxis.name = '' ) ) : _option.yAxis = { name: '' };
+    _option.yAxis ? (_option.yAxis.length > 0 ? (
+        _option.yAxis[0].axisLabel = {
+            ..._option.yAxis[0].axisLabel,
+            show: false,
+        }
+    ) : (
+        _option.yAxis.axisLabel = {
+            ..._option.yAxis.axisLabel,
+            show: false,
+        }
+    )) : _option.yAxis = {
+        axisLabel: {
+            show: false,
+        } 
+    };
+
     // 图形
     if(viewType ==='bar') { // 柱状图
         _option.series = _option.series.map(s => ({
             ...s, showSymbol: false, silent: true,
         }));
-        // x轴
-        _option.xAxis ? (_option.xAxis.length > 0 ? (
-            _option.xAxis[0].axisLabel = {
-                ..._option.xAxis[0].axisLabel,
-                show: false,
-            }
-        ) : (
-            _option.xAxis.axisLabel = {
-                ..._option.xAxis.axisLabel,
-                show: false,
-            }
-        )) : _option.xAxis = {
-            axisLabel: {
-                show: false,
-            } 
-        };
-        // y轴
-        _option.yAxis ? (_option.yAxis.length > 0 ? (
-            _option.yAxis[0].axisLabel = {
-                ..._option.yAxis[0].axisLabel,
-                show: false,
-            }
-        ) : (
-            _option.yAxis.axisLabel = {
-                ..._option.yAxis.axisLabel,
-                show: false,
-            }
-        )) : _option.yAxis = {
-            axisLabel: {
-                show: false,
-            } 
-        };
     }else if(viewType === 'line') { // 折线图
         _option.series = _option.series.map(s => ({
             ...s, showSymbol: false, silent: true
         }));
-        // x轴
-        _option.xAxis ? (_option.xAxis.length > 0 ? (
-            _option.xAxis[0].axisLabel = {
-                ..._option.xAxis[0].axisLabel,
-                show: false,
-            }
-        ) : (
-            _option.xAxis.axisLabel = {
-                ..._option.xAxis.axisLabel,
-                show: false,
-            }
-        )) : _option.xAxis = {
-            axisLabel: {
-                show: false,
-            } 
-        };
-        // y轴
-        _option.yAxis ? (_option.yAxis.length > 0 ? (
-            _option.yAxis[0].axisLabel = {
-                ..._option.yAxis[0].axisLabel,
-                show: false,
-            }
-        ) : (
-            _option.yAxis.axisLabel = {
-                ..._option.yAxis.axisLabel,
-                show: false,
-            }
-        )) : _option.yAxis = {
-            axisLabel: {
-                show: false,
-            } 
-        };
     }else if(viewType === 'pie') { // 饼图
         _option.series = _option.series.map(s => ({
             ...s,
@@ -111,6 +85,8 @@ export default (option) => {
             labelLine: { show: false },
             silent: true
         }));
+        delete _option.xAxis;
+        delete _option.yAxis;
     }else if(viewType === 'scatter') { // 散点图
         _option.series = _option.series.map(s => ({
             ...s, silent: true

src/components/chart/thumbnail.jsx

@@ -9,7 +9,7 @@ const Thumbnail = ({ style, type, code, option }) => {
         
     return (
         <div style={{ ...style, width: '100%', height: '100%' }}>
-            {viewType === 'echarts' ? <Echarts
+            {viewType === 'echarts' && !!newOption ? <Echarts
                 key={code}
                 option={newOption}
                 className='rc-echarts'

src/components/chartDesigner/sections/style/bar.jsx

@@ -23,8 +23,6 @@ class BarStyle extends React.Component {
         const { styleConfig, chartOption, barConfig } = chartDesigner;
         const { groupBy } = barConfig;
         const barStyle = styleConfig.bar || {};
-        chartOption.baseOption = chartOption.baseOption || {};
-        chartOption.baseOption.series = chartOption.baseOption.series || [];
 
         return <Form>
             <Divider>柱条</Divider>
@@ -34,30 +32,35 @@ class BarStyle extends React.Component {
                     placeholder='80'
                     onBlur={e => {
                         let value = e.target.value;
-                        let seriesArr = [];
-                        for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                            seriesArr.push({
-                                barMaxWidth: value || '80'
-                            });
-                        }
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { barMaxWidth: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } } ) },
-                        ] });
-                    }}
-                    onKeyDown={e => {
-                        if(e.keyCode === 13) {
-                            let value = e.target.value;
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { barMaxWidth: value } }) }];
+                        if(!!chartOption.baseOption) {
                             let seriesArr = [];
                             for(let i = 0; i < chartOption.baseOption.series.length; i++) {
                                 seriesArr.push({
                                     barMaxWidth: value || '80'
                                 });
                             }
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { barMaxWidth: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } } ) },
-                            ] });
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } } ) });
+                        }
+                        
+                        dispatch({ type: 'chartDesigner/setFields', fields });
+                    }}
+                    onKeyDown={e => {
+                        if(e.keyCode === 13) {
+                            let value = e.target.value;
+                            let fields = [
+                                { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { barMaxWidth: value } }) }
+                            ]
+                            if(!!chartOption.baseOption) {
+                                let seriesArr = [];
+                                for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                    seriesArr.push({
+                                        barMaxWidth: value || '80'
+                                    });
+                                }
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } } ) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -68,30 +71,32 @@ class BarStyle extends React.Component {
                     placeholder={0}
                     onBlur={e => {
                         let value = e.target.value;
-                        let seriesArr = [];
-                        for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                            seriesArr.push({
-                                barMinHeight: value || 0
-                            });
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { barMinHeight: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            let seriesArr = [];
+                            for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                seriesArr.push({
+                                    barMinHeight: value || 0
+                                });
+                            }
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
                         }
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { barMinHeight: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                        ] });
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                     onKeyDown={e => {
                         if(e.keyCode === 13) {
                             let value = e.target.value;
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { barMinHeight: value } }) }];
+                        if(!!chartOption.baseOption) {
                             let seriesArr = [];
                             for(let i = 0; i < chartOption.baseOption.series.length; i++) {
                                 seriesArr.push({
                                     barMinHeight: value || 0
                                 });
                             }
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { barMinHeight: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                            ] });
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -102,30 +107,32 @@ class BarStyle extends React.Component {
                     placeholder={'30%'}
                     onBlur={e => {
                         let value = e.target.value;
-                        let seriesArr = [];
-                        for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                            seriesArr.push({
-                                barGap: value || '30%'
-                            });
-                        }
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { barGap: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                        ] });
-                    }}
-                    onKeyDown={e => {
-                        if(e.keyCode === 13) {
-                            let value = e.target.value;
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { barGap: value } }) }];
+                        if(!!chartOption.baseOption) {
                             let seriesArr = [];
                             for(let i = 0; i < chartOption.baseOption.series.length; i++) {
                                 seriesArr.push({
                                     barGap: value || '30%'
                                 });
                             }
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { barGap: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                            ] });
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
+                    }}
+                    onKeyDown={e => {
+                        if(e.keyCode === 13) {
+                            let value = e.target.value;
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { barGap: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                let seriesArr = [];
+                                for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                    seriesArr.push({
+                                        barGap: value || '30%'
+                                    });
+                                }
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -138,17 +145,18 @@ class BarStyle extends React.Component {
                             checked={!!barStyle.labelVisible}
                             onChange={e => {
                                 let checked = e.target.checked;
-                                let seriesArr = [];
-                                for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                                    seriesArr.push({
-                                        label: { normal: { show: checked } },
-                                        labelLine: { normal: { show: checked } }
-                                    });
+                                let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { labelVisible: checked } }) }];
+                                if(!!chartOption.baseOption) {
+                                    let seriesArr = [];
+                                    for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                        seriesArr.push({
+                                            label: { normal: { show: checked } },
+                                            labelLine: { normal: { show: checked } }
+                                        });
+                                    }
+                                    fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
                                 }
-                                dispatch({ type: 'chartDesigner/setFields', fields: [
-                                    { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { labelVisible: checked } }) },
-                                    { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                                ] });
+                                dispatch({ type: 'chartDesigner/setFields', fields });
                             }}
                         />
                     </FormItem>
@@ -159,22 +167,24 @@ class BarStyle extends React.Component {
                             checked={!!barStyle.labelZeroVisible}
                             onChange={e => {
                                 let checked = e.target.checked;
-                                let seriesArr = [];
-                                for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                                    seriesArr.push({
-                                        label: { normal: {
-                                            formatterKey: checked,
-                                            formatter: !checked ? (params) => {
-                                                const { value } = params;
-                                                return value === 0 ? '' : value;
-                                            } : '{c}'
-                                        } },
-                                    });
+                                let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { labelZeroVisible: checked } }) }];
+                                if(!!chartOption.baseOption) {
+                                    let seriesArr = [];
+                                    for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                        seriesArr.push({
+                                            label: { normal: {
+                                                formatterKey: checked,
+                                                formatter: !checked ? (params) => {
+                                                    const { value } = params;
+                                                    return value === 0 ? '' : value;
+                                                } : '{c}'
+                                            } },
+                                        });
+                                    }
+                                    fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
                                 }
-                                dispatch({ type: 'chartDesigner/setFields', fields: [
-                                    { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { labelZeroVisible: checked } }) },
-                                    { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                                ] });
+                                
+                                dispatch({ type: 'chartDesigner/setFields', fields });
                             }}
                         />
                     </FormItem>}
@@ -184,16 +194,17 @@ class BarStyle extends React.Component {
                 <Select
                     defaultValue={barStyle.labelPosition || 'inside'}
                     onChange={(value, item) => {
-                        let seriesArr = [];
-                        for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                            seriesArr.push({
-                                label: { normal: { position: value } }
-                            });
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { labelPosition: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            let seriesArr = [];
+                            for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                seriesArr.push({
+                                    label: { normal: { position: value } }
+                                });
+                            }
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
                         }
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { labelPosition: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                        ] });
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 >
                     <Select.Option value='top'>外上</Select.Option>
@@ -217,22 +228,8 @@ class BarStyle extends React.Component {
                     placeholder={5}
                     onBlur={e => {
                         let value = e.target.value;
-                        let seriesArr = [];
-                        for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                            seriesArr.push({
-                                label: {
-                                     normal: { distance: (value === '' || value === null || value === undefined) ? 5 : Number(value) }
-                                }
-                            });
-                        }
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { labelDistance: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                        ] });
-                    }}
-                    onKeyDown={e => {
-                        if(e.keyCode === 13) {
-                            let value = e.target.value;
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { labelDistance: value } }) }];
+                        if(!!chartOption.baseOption) {
                             let seriesArr = [];
                             for(let i = 0; i < chartOption.baseOption.series.length; i++) {
                                 seriesArr.push({
@@ -241,10 +238,26 @@ class BarStyle extends React.Component {
                                     }
                                 });
                             }
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { labelDistance: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                            ] });
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
+                    }}
+                    onKeyDown={e => {
+                        if(e.keyCode === 13) {
+                            let value = e.target.value;
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { labelDistance: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                let seriesArr = [];
+                                for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                    seriesArr.push({
+                                        label: {
+                                            normal: { distance: (value === '' || value === null || value === undefined) ? 5 : Number(value) }
+                                        }
+                                    });
+                                }
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -255,22 +268,8 @@ class BarStyle extends React.Component {
                     placeholder={0}
                     onBlur={e => {
                         let value = e.target.value;
-                        let seriesArr = [];
-                        for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                            seriesArr.push({
-                                label: {
-                                    normal: { rotate: (value === '' || value === null || value === undefined) ? 0 : Number(value) }
-                                }
-                            });
-                        }
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { labelRotate: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                        ] });
-                    }}
-                    onKeyDown={e => {
-                        if(e.keyCode === 13) {
-                            let value = e.target.value;
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { labelRotate: value } }) }];
+                        if(!!chartOption.baseOption) {
                             let seriesArr = [];
                             for(let i = 0; i < chartOption.baseOption.series.length; i++) {
                                 seriesArr.push({
@@ -279,10 +278,26 @@ class BarStyle extends React.Component {
                                     }
                                 });
                             }
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { labelRotate: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                            ] });
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
+                    }}
+                    onKeyDown={e => {
+                        if(e.keyCode === 13) {
+                            let value = e.target.value;
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { labelRotate: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                let seriesArr = [];
+                                for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                    seriesArr.push({
+                                        label: {
+                                            normal: { rotate: (value === '' || value === null || value === undefined) ? 0 : Number(value) }
+                                        }
+                                    });
+                                }
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -292,12 +307,13 @@ class BarStyle extends React.Component {
                 <Select
                     defaultValue={barStyle.xNameLocation || 'end'}
                     onChange={(value, item) => {
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xNameLocation: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: { 
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xNameLocation: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: { 
                                 nameLocation: (value === '' || value === null || value === undefined) ? 'end' : value
-                             }} } }) },
-                        ] });
+                             }} } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 >
                     <Select.Option value='start'>头部</Select.Option>
@@ -311,22 +327,24 @@ class BarStyle extends React.Component {
                     placeholder={15}
                     onBlur={e => {
                         let value = e.target.value;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xNameGap: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xNameGap: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                 nameGap: (value === '' || value === null || value === undefined) ? 15 : Number(value)
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                     onKeyDown={e => {
                         if(e.keyCode === 13) {
                             let value = e.target.value;
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xNameGap: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xNameGap: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                     nameGap: (value === '' || value === null || value === undefined) ? 15 : Number(value)
-                                } } } }) },
-                            ] });
+                                } } } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -337,22 +355,24 @@ class BarStyle extends React.Component {
                     placeholder={0}
                     onBlur={e => {
                         let value = e.target.value;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xNameRotate: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xNameRotate: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                 nameRotate: (value === '' || value === null || value === undefined) ? 0 : Number(value)
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                     onKeyDown={e => {
                         if(e.keyCode === 13) {
                             let value = e.target.value;
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xNameRotate: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xNameRotate: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                     nameRotate: (value === '' || value === null || value === undefined) ? 0 : Number(value)
-                                } } } }) },
-                            ] });
+                                } } } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -363,14 +383,15 @@ class BarStyle extends React.Component {
                     checked={barStyle.xLabelHiddenCover === undefined ? true : barStyle.xLabelHiddenCover}
                     onChange={e => {
                         let checked = e.target.checked;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xLabelHiddenCover: checked } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xLabelHiddenCover: checked } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                 axisLabel: {
                                     interval: checked ? 'auto' : 0
                                 }
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 />
             </FormItem>
@@ -380,26 +401,28 @@ class BarStyle extends React.Component {
                     placeholder={8}
                     onBlur={e => {
                         let value = e.target.value;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xLabelMargin: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xLabelMargin: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                 axisLabel: {
                                     margin: (value === '' || value === null || value === undefined) ? 8 : Number(value)
                                 }
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                     onKeyDown={e => {
                         if(e.keyCode === 13) {
                             let value = e.target.value;
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xLabelMargin: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xLabelMargin: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                     axisLabel: {
                                         margin: (value === '' || value === null || value === undefined) ? 8 : Number(value)
                                     }
-                                } } } }) },
-                            ] });
+                                } } } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -410,26 +433,28 @@ class BarStyle extends React.Component {
                     placeholder={0}
                     onBlur={e => {
                         let value = e.target.value;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xLabelRotate: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xLabelRotate: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                 axisLabel: {
                                     rotate: (value === '' || value === null || value === undefined) ? 0 : Number(value)
                                 }
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                     onKeyDown={e => {
                         if(e.keyCode === 13) {
                             let value = e.target.value;
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xLabelRotate: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { xLabelRotate: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                     axisLabel: {
                                         rotate: (value === '' || value === null || value === undefined) ? 0 : Number(value)
                                     }
-                                } } } }) },
-                            ] });
+                                } } } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -439,12 +464,13 @@ class BarStyle extends React.Component {
                 <Select
                     defaultValue={barStyle.yNameLocation || 'end'}
                     onChange={(value, item) => {
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { yNameLocation: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: { 
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { yNameLocation: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: { 
                                 nameLocation: (value === '' || value === null || value === undefined) ? 'end' : value,
-                             }} } }) },
-                        ] });
+                             }} } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 >
                     <Select.Option value='start'>头部</Select.Option>
@@ -458,22 +484,24 @@ class BarStyle extends React.Component {
                     placeholder={15}
                     onBlur={e => {
                         let value = e.target.value;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { yNameGap: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { yNameGap: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
                                 nameGap: (value === '' || value === null || value === undefined) ? 15 : Number(value)
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                     onKeyDown={e => {
                         if(e.keyCode === 13) {
                             let value = e.target.value;
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { yNameGap: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { yNameGap: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
                                     nameGap: (value === '' || value === null || value === undefined) ? 15 : Number(value)
-                                } } } }) },
-                            ] });
+                                } } } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -484,22 +512,24 @@ class BarStyle extends React.Component {
                     placeholder={0}
                     onBlur={e => {
                         let value = e.target.value;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { yNameRotate: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { yNameRotate: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
                                 nameRotate: (value === '' || value === null || value === undefined) ? 0 : Number(value)
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                     onKeyDown={e => {
                         if(e.keyCode === 13) {
                             let value = e.target.value;
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { yNameRotate: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { yNameRotate: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
                                     nameRotate: (value === '' || value === null || value === undefined) ? 0 : Number(value)
-                                } } } }) },
-                            ] });
+                                } } } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -510,16 +540,17 @@ class BarStyle extends React.Component {
                     checked={!!barStyle.stack}
                     onChange={e => {
                         let checked = e.target.checked;
-                        let seriesArr = [];
-                        for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                            seriesArr.push({
-                                stack: checked
-                            });
+                        let fields = [];
+                        if(!!chartOption.baseOption) {
+                            let seriesArr = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { stack: checked } }) }];
+                            for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                seriesArr.push({
+                                    stack: checked
+                                });
+                            }
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
                         }
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { stack: checked } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                        ] });
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 />
             </FormItem>}
@@ -529,14 +560,15 @@ class BarStyle extends React.Component {
                     checked={!!barStyle.dataZoomVisible}
                     onChange={e => {
                         let checked = e.target.checked;
-                        let legendVisible = chartOption.baseOption.legend ? chartOption.baseOption.legend.show : false;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { bar: { dataZoomVisible: checked } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { bar: { dataZoomVisible: checked } }) }];
+                        if(!!chartOption.baseOption) {
+                            let legendVisible = chartOption.baseOption.legend ? chartOption.baseOption.legend.show : false;
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, {
                                 baseOption: { dataZoom: { show: checked } },
                                 media: EChartsMedia('bar', legendVisible, checked)
-                            }) },
-                        ] });
+                            }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 />
             </FormItem>

src/components/chartDesigner/sections/style/line.jsx

@@ -23,8 +23,6 @@ class LineStyle extends React.Component {
         const { styleConfig, chartOption, lineConfig } = chartDesigner;
         const { groupBy } = lineConfig;
         const lineStyle = styleConfig.line || {};
-        chartOption.baseOption = chartOption.baseOption || {};
-        chartOption.baseOption.series = chartOption.baseOption.series || [];
 
         return <Form>
             <Divider>线条</Divider>
@@ -33,16 +31,17 @@ class LineStyle extends React.Component {
                     checked={!!lineStyle.lineSmooth}
                     onChange={e => {
                         let checked = e.target.checked;
-                        let seriesArr = [];
-                        for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                            seriesArr.push({
-                                smooth: checked
-                            });
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { lineSmooth: checked } }) }];
+                        if(!!chartOption.baseOption) {
+                            let seriesArr = [];
+                            for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                seriesArr.push({
+                                    smooth: checked
+                                });
+                            }
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
                         }
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { line: { lineSmooth: checked } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                        ] });
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 />
             </FormItem>
@@ -52,17 +51,18 @@ class LineStyle extends React.Component {
                     checked={!!lineStyle.labelVisible}
                     onChange={e => {
                         let checked = e.target.checked;
-                        let seriesArr = [];
-                        for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                            seriesArr.push({
-                                label: { normal: { show: checked } },
-                                labelLine: { normal: { show: checked } },
-                            });
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelVisible: checked } }) }];
+                        if(!!chartOption.baseOption) {
+                            let seriesArr = [];
+                            for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                seriesArr.push({
+                                    label: { normal: { show: checked } },
+                                    labelLine: { normal: { show: checked } },
+                                });
+                            }
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
                         }
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelVisible: checked } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                        ] });
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 />
             </FormItem>}
@@ -70,16 +70,17 @@ class LineStyle extends React.Component {
                 <Select
                     defaultValue={lineStyle.labelPosition || 'inside'}
                     onChange={(value, item) => {
-                        let seriesArr = [];
-                        for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                            seriesArr.push({
-                                label: { normal: { position: value } }
-                            });
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelPosition: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            let seriesArr = [];
+                            for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                seriesArr.push({
+                                    label: { normal: { position: value } }
+                                });
+                            }
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
                         }
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelPosition: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                        ] });
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 >
                     <Select.Option value='top'>外上</Select.Option>
@@ -104,22 +105,8 @@ class LineStyle extends React.Component {
                     placeholder={5}
                     onBlur={e => {
                         let value = e.target.value;
-                        let seriesArr = [];
-                        for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                            seriesArr.push({
-                                label: {
-                                    normal: { distance: (value === '' || value === null || value === undefined) ? 5 : Number(value) }
-                                }
-                            });
-                        }
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelDistance: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                        ] });
-                    }}
-                    onKeyDown={e => {
-                        if(e.keyCode === 13) {
-                            let value = e.target.value;
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelDistance: value } }) }];
+                        if(!!chartOption.baseOption) {
                             let seriesArr = [];
                             for(let i = 0; i < chartOption.baseOption.series.length; i++) {
                                 seriesArr.push({
@@ -128,10 +115,26 @@ class LineStyle extends React.Component {
                                     }
                                 });
                             }
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelDistance: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                            ] });
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
+                    }}
+                    onKeyDown={e => {
+                        if(e.keyCode === 13) {
+                            let value = e.target.value;
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelDistance: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                let seriesArr = [];
+                                for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                    seriesArr.push({
+                                        label: {
+                                            normal: { distance: (value === '' || value === null || value === undefined) ? 5 : Number(value) }
+                                        }
+                                    });
+                                }
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -142,22 +145,8 @@ class LineStyle extends React.Component {
                     placeholder={0}
                     onBlur={e => {
                         let value = e.target.value;
-                        let seriesArr = [];
-                        for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                            seriesArr.push({
-                                label: {
-                                    normal: { rotate: (value === '' || value === null || value === undefined) ? 0 : Number(value) }
-                                }
-                            });
-                        }
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelRotate: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                        ] });
-                    }}
-                    onKeyDown={e => {
-                        if(e.keyCode === 13) {
-                            let value = e.target.value;
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelRotate: value } }) }];
+                        if(!!chartOption.baseOption) {
                             let seriesArr = [];
                             for(let i = 0; i < chartOption.baseOption.series.length; i++) {
                                 seriesArr.push({
@@ -166,10 +155,26 @@ class LineStyle extends React.Component {
                                     }
                                 });
                             }
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelRotate: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                            ] });
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
+                    }}
+                    onKeyDown={e => {
+                        if(e.keyCode === 13) {
+                            let value = e.target.value;
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelRotate: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                let seriesArr = [];
+                                for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                    seriesArr.push({
+                                        label: {
+                                            normal: { rotate: (value === '' || value === null || value === undefined) ? 0 : Number(value) }
+                                        }
+                                    });
+                                }
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -178,16 +183,17 @@ class LineStyle extends React.Component {
                 <Select
                     defaultValue={lineStyle.labelSymbol || 'emptyCircle'}
                     onChange={(value, item) => {
-                        let seriesArr = [];
-                        for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                            seriesArr.push({
-                                symbol: value
-                            });
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelSymbol: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            let seriesArr = [];
+                            for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                seriesArr.push({
+                                    symbol: value
+                                });
+                            }
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
                         }
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelSymbol: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                        ] });
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 >
                     <Select.Option value='circle'>圆</Select.Option>
@@ -207,30 +213,32 @@ class LineStyle extends React.Component {
                     placeholder={4}
                     onBlur={e => {
                         let value = e.target.value;
-                        let seriesArr = [];
-                        for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                            seriesArr.push({
-                                symbolSize: (value === '' || value === null || value === undefined) ? 4 : Number(value)
-                            });
-                        }
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelSymbolSize: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                        ] });
-                    }}
-                    onKeyDown={e => {
-                        if(e.keyCode === 13) {
-                            let value = e.target.value;
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelSymbolSize: value } }) }];
+                        if(!!chartOption.baseOption) {
                             let seriesArr = [];
                             for(let i = 0; i < chartOption.baseOption.series.length; i++) {
                                 seriesArr.push({
                                     symbolSize: (value === '' || value === null || value === undefined) ? 4 : Number(value)
                                 });
                             }
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelSymbolSize: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                            ] });
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
+                    }}
+                    onKeyDown={e => {
+                        if(e.keyCode === 13) {
+                            let value = e.target.value;
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { labelSymbolSize: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                let seriesArr = [];
+                                for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                    seriesArr.push({
+                                        symbolSize: (value === '' || value === null || value === undefined) ? 4 : Number(value)
+                                    });
+                                }
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -240,12 +248,13 @@ class LineStyle extends React.Component {
                 <Select
                     defaultValue={lineStyle.xNameLocation || 'end'}
                     onChange={(value, item) => {
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { line: { xNameLocation: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: { 
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { xNameLocation: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: { 
                                 nameLocation: (value === '' || value === null || value === undefined) ? 'end' : value
-                             }} } }) },
-                        ] });
+                             }} } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 >
                     <Select.Option value='start'>头部</Select.Option>
@@ -259,22 +268,24 @@ class LineStyle extends React.Component {
                     placeholder={15}
                     onBlur={e => {
                         let value = e.target.value;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { line: { xNameGap: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { xNameGap: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                 nameGap: (value === '' || value === null || value === undefined) ? 15 : Number(value)
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                     onKeyDown={e => {
                         if(e.keyCode === 13) {
                             let value = e.target.value;
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { line: { xNameGap: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { xNameGap: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                     nameGap: (value === '' || value === null || value === undefined) ? 15 : Number(value)
-                                } } } }) },
-                            ] });
+                                } } } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -285,22 +296,24 @@ class LineStyle extends React.Component {
                     placeholder={0}
                     onBlur={e => {
                         let value = e.target.value;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { line: { xNameRotate: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { xNameRotate: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                 nameRotate: (value === '' || value === null || value === undefined) ? 0 : Number(value)
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                     onKeyDown={e => {
                         if(e.keyCode === 13) {
                             let value = e.target.value;
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { line: { xNameRotate: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { xNameRotate: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                     nameRotate: (value === '' || value === null || value === undefined) ? 0 : Number(value)
-                                } } } }) },
-                            ] });
+                                } } } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -312,26 +325,28 @@ class LineStyle extends React.Component {
                     placeholder={8}
                     onBlur={e => {
                         let value = e.target.value;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { line: { xLabelMargin: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { xLabelMargin: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                 axisLabel: {
                                     margin: (value === '' || value === null || value === undefined) ? 8 : Number(value)
                                 }
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                     onKeyDown={e => {
                         if(e.keyCode === 13) {
                             let value = e.target.value;
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { line: { xLabelMargin: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { xLabelMargin: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                     axisLabel: {
                                         margin: (value === '' || value === null || value === undefined) ? 8 : Number(value)
                                     }
-                                } } } }) },
-                            ] });
+                                } } } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -342,26 +357,28 @@ class LineStyle extends React.Component {
                     placeholder={0}
                     onBlur={e => {
                         let value = e.target.value;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { line: { xLabelRotate: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { xLabelRotate: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                 axisLabel: {
                                     rotate: (value === '' || value === null || value === undefined) ? 0 : Number(value)
                                 }
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                     onKeyDown={e => {
                         if(e.keyCode === 13) {
                             let value = e.target.value;
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { line: { xLabelRotate: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { xLabelRotate: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                     axisLabel: {
                                         rotate: (value === '' || value === null || value === undefined) ? 0 : Number(value)
                                     }
-                                } } } }) },
-                            ] });
+                                } } } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -371,12 +388,13 @@ class LineStyle extends React.Component {
                 <Select
                     defaultValue={lineStyle.yNameLocation || 'end'}
                     onChange={(value, item) => {
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { line: { yNameLocation: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: { 
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { yNameLocation: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: { 
                                 nameLocation: (value === '' || value === null || value === undefined) ? 'end' : value,
-                             }} } }) },
-                        ] });
+                             }} } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 >
                     <Select.Option value='start'>头部</Select.Option>
@@ -390,22 +408,24 @@ class LineStyle extends React.Component {
                     placeholder={15}
                     onBlur={e => {
                         let value = e.target.value;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { line: { yNameGap: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { yNameGap: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
                                 nameGap: (value === '' || value === null || value === undefined) ? 15 : Number(value)
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                     onKeyDown={e => {
                         if(e.keyCode === 13) {
                             let value = e.target.value;
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { line: { yNameGap: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { yNameGap: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
                                     nameGap: (value === '' || value === null || value === undefined) ? 15 : Number(value)
-                                } } } }) },
-                            ] });
+                                } } } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -416,22 +436,24 @@ class LineStyle extends React.Component {
                     placeholder={0}
                     onBlur={e => {
                         let value = e.target.value;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { line: { yNameRotate: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { yNameRotate: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
                                 nameRotate: (value === '' || value === null || value === undefined) ? 0 : Number(value)
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                     onKeyDown={e => {
                         if(e.keyCode === 13) {
                             let value = e.target.value;
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { line: { yNameRotate: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { yNameRotate: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
                                     nameRotate: (value === '' || value === null || value === undefined) ? 0 : Number(value)
-                                } } } }) },
-                            ] });
+                                } } } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -442,16 +464,17 @@ class LineStyle extends React.Component {
                     checked={!!lineStyle.stack}
                     onChange={e => {
                         let checked = e.target.checked;
-                        let seriesArr = [];
-                        for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                            seriesArr.push({
-                                stack: checked
-                            });
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { stack: checked } }) }];
+                        if(!!chartOption.baseOption) {
+                            let seriesArr = [];
+                            for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                seriesArr.push({
+                                    stack: checked
+                                });
+                            }
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
                         }
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { line: { stack: checked } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                        ] });
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 />
             </FormItem>}
@@ -461,14 +484,15 @@ class LineStyle extends React.Component {
                     checked={!!lineStyle.dataZoomVisible}
                     onChange={e => {
                         let checked = e.target.checked;
-                        let legendVisible = chartOption.baseOption.legend ? chartOption.baseOption.legend.show : false;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { line: { dataZoomVisible: checked } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { line: { dataZoomVisible: checked } }) }];
+                        if(!!chartOption.baseOption) {
+                            let legendVisible = chartOption.baseOption.legend ? chartOption.baseOption.legend.show : false;
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, {
                                 baseOption: { dataZoom: { show: checked } },
                                 media: EChartsMedia('line', legendVisible, checked)
-                            }) },
-                        ] });
+                            }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 />
             </FormItem>

src/components/chartDesigner/sections/style/pie.jsx

@@ -27,14 +27,15 @@ class PieStyleConfig extends React.Component {
                     checked={!!pieStyle.labelHidden}
                     onChange={e => {
                         let checked = e.target.checked;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { pie: { labelHidden: checked } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { pie: { labelHidden: checked } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: { 0: {
                                 label: { normal: { show: !checked } },
                                 labelLine: { normal: { show: !checked } },
                                 avoidLabelOverlap: !checked,
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 />
             </Form.Item>

src/components/chartDesigner/sections/style/scatter.jsx

@@ -22,8 +22,6 @@ class ScatterStyle extends React.Component {
         const { chartDesigner, dispatch } = this.props;
         const { styleConfig, chartOption } = chartDesigner;
         const scatterStyle = styleConfig.scatter || {};
-        chartOption.baseOption = chartOption.baseOption || {};
-        chartOption.baseOption.series = chartOption.baseOption.series || [];
 
         return <Form>
             <Divider>标注</Divider>
@@ -31,16 +29,17 @@ class ScatterStyle extends React.Component {
                 <Select
                     defaultValue={scatterStyle.labelSymbol || 'circle'}
                     onChange={(value, item) => {
-                        let seriesArr = [];
-                        for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                            seriesArr.push({
-                                symbol: value
-                            });
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { labelSymbol: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            let seriesArr = [];
+                            for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                seriesArr.push({
+                                    symbol: value
+                                });
+                            }
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
                         }
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { labelSymbol: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                        ] });
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 >
                     <Select.Option value='circle'>圆</Select.Option>
@@ -60,30 +59,32 @@ class ScatterStyle extends React.Component {
                     placeholder={10}
                     onBlur={e => {
                         let value = e.target.value;
-                        let seriesArr = [];
-                        for(let i = 0; i < chartOption.baseOption.series.length; i++) {
-                            seriesArr.push({
-                                symbolSize: (value === '' || value === null || value === undefined) ? 10 : Number(value)
-                            });
-                        }
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { labelSymbolSize: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                        ] });
-                    }}
-                    onKeyDown={e => {
-                        if(e.keyCode === 13) {
-                            let value = e.target.value;
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { labelSymbolSize: value } }) }];
+                        if(!!chartOption.baseOption) {
                             let seriesArr = [];
                             for(let i = 0; i < chartOption.baseOption.series.length; i++) {
                                 seriesArr.push({
                                     symbolSize: (value === '' || value === null || value === undefined) ? 10 : Number(value)
                                 });
                             }
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { labelSymbolSize: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) },
-                            ] });
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
+                    }}
+                    onKeyDown={e => {
+                        if(e.keyCode === 13) {
+                            let value = e.target.value;
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { labelSymbolSize: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                let seriesArr = [];
+                                for(let i = 0; i < chartOption.baseOption.series.length; i++) {
+                                    seriesArr.push({
+                                        symbolSize: (value === '' || value === null || value === undefined) ? 10 : Number(value)
+                                    });
+                                }
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { series: seriesArr } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -93,12 +94,13 @@ class ScatterStyle extends React.Component {
                 <Select
                     defaultValue={scatterStyle.xNameLocation || 'end'}
                     onChange={(value, item) => {
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { xNameLocation: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: { 
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { xNameLocation: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: { 
                                 nameLocation: (value === '' || value === null || value === undefined) ? 'end' : value
-                             }} } }) },
-                        ] });
+                             }} } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 >
                     <Select.Option value='start'>头部</Select.Option>
@@ -112,22 +114,24 @@ class ScatterStyle extends React.Component {
                     placeholder={15}
                     onBlur={e => {
                         let value = e.target.value;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { xNameGap: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { xNameGap: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                 nameGap: (value === '' || value === null || value === undefined) ? 15 : Number(value)
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                     onKeyDown={e => {
                         if(e.keyCode === 13) {
                             let value = e.target.value;
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { xNameGap: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { xNameGap: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                     nameGap: (value === '' || value === null || value === undefined) ? 15 : Number(value)
-                                } } } }) },
-                            ] });
+                                } } } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -138,22 +142,24 @@ class ScatterStyle extends React.Component {
                     placeholder={0}
                     onBlur={e => {
                         let value = e.target.value;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { xNameRotate: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { xNameRotate: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                 nameRotate: (value === '' || value === null || value === undefined) ? 0 : Number(value)
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                     onKeyDown={e => {
                         if(e.keyCode === 13) {
                             let value = e.target.value;
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { xNameRotate: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { xNameRotate: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { xAxis: { 0: {
                                     nameRotate: (value === '' || value === null || value === undefined) ? 0 : Number(value)
-                                } } } }) },
-                            ] });
+                                } } } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -163,12 +169,13 @@ class ScatterStyle extends React.Component {
                 <Select
                     defaultValue={scatterStyle.yNameLocation || 'end'}
                     onChange={(value, item) => {
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { yNameLocation: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: { 
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { yNameLocation: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: { 
                                 nameLocation: (value === '' || value === null || value === undefined) ? 'end' : value,
-                             }} } }) },
-                        ] });
+                             }} } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 >
                     <Select.Option value='start'>头部</Select.Option>
@@ -182,22 +189,24 @@ class ScatterStyle extends React.Component {
                     placeholder={15}
                     onBlur={e => {
                         let value = e.target.value;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { yNameGap: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { yNameGap: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
                                 nameGap: (value === '' || value === null || value === undefined) ? 15 : Number(value)
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                     onKeyDown={e => {
                         if(e.keyCode === 13) {
                             let value = e.target.value;
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { yNameGap: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { yNameGap: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
                                     nameGap: (value === '' || value === null || value === undefined) ? 15 : Number(value)
-                                } } } }) },
-                            ] });
+                                } } } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -208,22 +217,24 @@ class ScatterStyle extends React.Component {
                     placeholder={0}
                     onBlur={e => {
                         let value = e.target.value;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { yNameRotate: value } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { yNameRotate: value } }) }];
+                        if(!!chartOption.baseOption) {
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
                                 nameRotate: (value === '' || value === null || value === undefined) ? 0 : Number(value)
-                            } } } }) },
-                        ] });
+                            } } } }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                     onKeyDown={e => {
                         if(e.keyCode === 13) {
                             let value = e.target.value;
-                            dispatch({ type: 'chartDesigner/setFields', fields: [
-                                { name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { yNameRotate: value } }) },
-                                { name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
+                            let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { yNameRotate: value } }) }];
+                            if(!!chartOption.baseOption) {
+                                fields.push({ name: 'chartOption', value: deepAssign(chartOption, { baseOption: { yAxis: { 0: {
                                     nameRotate: (value === '' || value === null || value === undefined) ? 0 : Number(value)
-                                } } } }) },
-                            ] });
+                                } } } }) });
+                            }
+                            dispatch({ type: 'chartDesigner/setFields', fields });
                         }
                     }}
                 />
@@ -234,14 +245,15 @@ class ScatterStyle extends React.Component {
                     checked={!!scatterStyle.dataZoomVisible}
                     onChange={e => {
                         let checked = e.target.checked;
-                        let legendVisible = chartOption.baseOption.legend ? chartOption.baseOption.legend.show : false;
-                        dispatch({ type: 'chartDesigner/setFields', fields: [
-                            { name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { dataZoomVisible: checked } }) },
-                            { name: 'chartOption', value: deepAssign(chartOption, {
+                        let fields = [{ name: 'styleConfig', value: deepAssign(styleConfig, { scatter: { dataZoomVisible: checked } }) }];
+                        if(!!chartOption.baseOption) {
+                            let legendVisible = chartOption.baseOption.legend ? chartOption.baseOption.legend.show : false;
+                            fields.push({ name: 'chartOption', value: deepAssign(chartOption, {
                                 baseOption: { dataZoom: { show: checked } },
                                 media: EChartsMedia('scatter', legendVisible, checked)
-                            }) },
-                        ] });
+                            }) });
+                        }
+                        dispatch({ type: 'chartDesigner/setFields', fields });
                     }}
                 />
             </FormItem>