chart media option

src/components/chartDesigner/charts/echartsView.jsx

@@ -14,6 +14,7 @@ class EchartsView extends Component {
         if(!chartOption || ((!chartOption.series || chartOption.series.length === 0 || !chartOption.series[0].data || chartOption.series[0].data.length === 0) && (!chartOption.baseOption || !chartOption.baseOption.series || chartOption.baseOption.series.length === 0 || !chartOption.baseOption.series[0].data || chartOption.baseOption.series[0].data.length === 0))) {
             return <EmptyContent />
         }else {
+            console.log(chartOption);
             const { baseOption } = chartOption;
             const { name } = baseOption;//主题
             //drillDown 钻取层级数组

src/components/dashboardDesigner/viewLayout.less

@@ -335,6 +335,8 @@
         .chartview-content {
           flex:1;
           overflow: hidden;
+          display: flex;
+          flex-direction: column;
           .ant-table-body {
             margin-top: 0;
           }

src/models/EChartsMedia.js

@@ -9,6 +9,7 @@ import { deepAssign } from '../utils/baseUtils'
  *      | A  | B  | C
  *    0 +----+----+---
  *      0   500  1000
+ * 
  */
 export default function(chartType, legendVisible, dataZoomVisible, assignConfig) {
     if(chartType === 'bar' || chartType === 'line' || chartType === 'scatter') {
@@ -28,24 +29,51 @@ export default function(chartType, legendVisible, dataZoomVisible, assignConfig)
             option: deepAssign({ legend: { type: 'scroll', top: 50, right: 50, bottom: 100, orient: 'vertical', width: '35%' }, grid: { right: '16%' } }, assignConfig)
         }, {
             query: { maxWidth: 1000, maxHeight: 1000 }, // E
-            option: !dataZoomVisible ? deepAssign({ legend: { type: 'scroll', right: 'center', bottom: 50, orient: 'horizontal', width: '90%' }, grid: { bottom: 100 } }, assignConfig) :
+            option: !dataZoomVisible ? deepAssign({
+                    legend: { type: 'scroll', right: 'center', bottom: 50, orient: 'horizontal', width: '90%' },
+                    grid: { bottom: 50 }
+                }, assignConfig) :
                 deepAssign({ legend: { type: 'scroll', right: 'center', top: 50, orient: 'horizontal', width: '90%' }, grid: { top: 100 } }, assignConfig)
         }, {
             query: { maxWidth: 500, maxHeight: 1000 }, // D
-            option: !dataZoomVisible ? deepAssign({ legend: { type: 'scroll', right: 'center', bottom: 0, orient: 'horizontal', width: '90%' }, grid: { bottom: 50 } }, assignConfig) :
+            option: !dataZoomVisible ? deepAssign({
+                    legend: { type: 'scroll', right: 'center', bottom: 0, orient: 'horizontal', width: '90%' },
+                    grid: { left: 100, right: 100, bottom: 50 }
+                }, assignConfig) :
                 deepAssign({ legend: { type: 'scroll', right: 'center', top: 0, orient: 'horizontal', width: '90%' }, }, assignConfig)
         }, {
             query: { minWidth: 1000, maxHeight: 500 }, // C
             option: deepAssign({ legend: {  type: 'scroll', top: 50, right: 50, orient: 'vertical', height: '80%', width: '35%' }, grid: { right: '20%'} }, assignConfig)
         }, {
             query: { maxWidth: 1000, maxHeight: 500 }, // B
-            option: !dataZoomVisible ? deepAssign({ legend: { type: 'scroll', right: 'center', bottom: 0, orient: 'horizontal', width: '90%' }, grid: { top: 50, left: 80, right: 80, bottom: 50 } }, assignConfig) :
+            option: !dataZoomVisible ? deepAssign({
+                    legend: { type: 'scroll', right: 'center', bottom: 0, orient: 'horizontal', width: '90%' },
+                    grid: { top: 50, left: 80, right: 80, bottom: 50 }
+                }, assignConfig) :
                 deepAssign({ legend: { type: 'scroll', right: 'center', top: 20, orient: 'horizontal', width: '90%' }, grid: { top: 80, left: 80, right: 80 } }, assignConfig)
         }, {
             query: { maxWidth: 500, maxHeight: 500 }, // A
-            option: !dataZoomVisible ? deepAssign({ legend: { type: 'scroll', right: 'center', bottom: 0, orient: 'horizontal', width: '90%' }, grid: { top: 50, left: 80, right: 80 } }, assignConfig) :
+            option: !dataZoomVisible ? deepAssign({
+                    legend: { type: 'scroll', right: 'center', bottom: 0, orient: 'horizontal', width: '90%' },
+                    grid: { top: 50, left: 80, right: 80, bottom: 50 }
+                }, assignConfig) :
                 deepAssign({ legend: { type: 'scroll', right: 'center', top: 20, orient: 'horizontal', width: '90%' }, grid: { top: 80, left: 80, right: 80 } }, assignConfig)
-        }] : []
+        }]
+            :
+        [{
+            query: { minWidth: 1000 }, // CFI
+            option: deepAssign({}, assignConfig)
+        }, {
+            query: { maxWidth: 1000 }, // BEH
+            option: deepAssign({
+                grid: { right: 50 }
+            }, assignConfig)
+        }, {
+            query: { maxWidth: 500 }, // ADG
+            option: deepAssign({
+                grid: { right: 50 }
+            }, assignConfig)
+        }]
     }else if(chartType === 'pie') {
         return [{
             query: { minWidth: 1000, minHeight: 1000 }, // I

src/models/dashboard.js

@@ -101,7 +101,7 @@ export default {
                                         name: item.dataSourceName
                                     })
                                 }
-                                if(!dataConnects.find(ad => ad.code === item.dataSourceCode)) {
+                                if(!dataConnects.find(ad => ad.code === item.dataConnectCode)) {
                                     dataConnects.push({
                                         code: item.dataConnectCode,
                                         name: item.dataConnectName
@@ -506,7 +506,7 @@ export default {
                                         name: item.dataSourceName
                                     })
                                 }
-                                if(!dataConnects.find(ad => ad.code === item.dataSourceCode)) {
+                                if(!dataConnects.find(ad => ad.code === item.dataConnectCode)) {
                                     dataConnects.push({
                                         code: item.dataConnectCode,
                                         name: item.dataConnectName

src/models/parseChartOption.js

@@ -102,6 +102,9 @@ function barOption(data, barConfig, themeConfig, styleConfig, drillDown) {
         legend: {
             show: legendVisible
         },
+        grid: {
+            containLabel: true
+        },
         xAxis: [{
             type: 'category',
             nameLocation: (xNameLocation === '' || xNameLocation === null || xNameLocation === undefined) ? 'end' : xNameLocation,
@@ -222,6 +225,9 @@ function lineOption(data, lineConfig, themeConfig, styleConfig, drillDown) {
         legend: {
             show: legendVisible
         },
+        grid: {
+            containLabel: true
+        },
         xAxis: [{
             name: xTitle || '横轴',
             type: 'category',
@@ -424,6 +430,9 @@ function scatterOption(data, scatterConfig, themeConfig, styleConfig) {
         legend: {
             show: legendVisible
         },
+        grid: {
+            containLabel: true
+        },
         xAxis : [{
             type : 'value',
             name: xTitle || '横轴',