Browse Source

需求--中国地图-路线图配置增加

qianming 3 years ago
parent
commit
1a7cba59d6

+ 62 - 0
report-ui/src/views/bigscreenDesigner/designer/tools/configure/widget-map.js

@@ -167,6 +167,47 @@ export const widgetMap = {
             },
           ],
         },
+        {
+          name: '图标设置',
+          list: [
+            {
+              type: 'el-select',
+              label: '图标样式',
+              name: 'symbol',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'arrow', name: '箭头'},
+                {code: 'plane', name: '飞机'},
+              ],
+              value: 'arrow'
+            },
+            {
+              type: 'el-input-number',
+              label: '动画速度',
+              name: 'symbolPeriod',
+              required: false,
+              placeholder: '',
+              value: 4,
+            },
+            {
+              type: 'el-input-number',
+              label: '图标大小',
+              name: 'symbolSize',
+              required: false,
+              placeholder: '',
+              value: 10,
+            },
+            {
+              type: 'vue-color',
+              label: '图标颜色',
+              name: 'symbolColor',
+              required: false,
+              placeholder: '',
+              value: '#46bee9'
+            },
+          ],
+        },
         {
           name: '点设置',
           list: [
@@ -188,6 +229,27 @@ export const widgetMap = {
             },
           ],
         },
+        {
+          name: '线设置',
+          list: [
+            {
+              type: 'vue-color',
+              label: '线颜色',
+              name: 'lineColor',
+              required: false,
+              placeholder: '',
+              value: '#ffa022'
+            },
+            {
+              type: 'el-input-number',
+              label: '线宽度',
+              name: 'lineWidth',
+              required: false,
+              placeholder: '',
+              value: 2,
+            },
+          ],
+        },
         {
           name: '地图颜色',
           list: [

+ 55 - 6
report-ui/src/views/bigscreenDesigner/designer/widget/map/widgetLineMap.vue

@@ -188,7 +188,7 @@ export default {
             type: "lines",
             zlevel: 1,
             effect: {
-              show: true,
+              show: false,
               period: 6,
               trailLength: 0.7,
               color: "#fff",
@@ -210,14 +210,14 @@ export default {
             symbolSize: 10,
             effect: {
               show: true,
-              period: 6,
+              period: 4,
               trailLength: 0,
-              symbol: planePath,
-              symbolSize: 15
+              symbol: 'arrow',
+              symbolSize: 5
             },
             lineStyle: {
               normal: {
-                // 小飞机颜色+ 线条
+                // 颜色+ 线条
                 color: '#ffa022',
                 width: 1,
                 opacity: 0.4,
@@ -313,7 +313,9 @@ export default {
     editorOptions() {
       this.setOptionsTitle();
       this.setOptionsText();
+      this.setOptionsSymbol();
       this.setOptionsPoint();
+      this.setOptionsLine();
       this.setOptionsColor();
       this.setOptionsData();
     },
@@ -350,7 +352,39 @@ export default {
       }
       lable["normal"] = normal;
     },
-    // 地图点设置
+    // 图标设置
+    setOptionsSymbol(){
+      const optionsSetup = this.optionsSetup;
+      const series = this.options.series[1];
+      const effect = {
+        show: true,
+        period: this.setPeriod(optionsSetup),
+        trailLength: 0,
+        symbol: this.setSymbol(optionsSetup),
+        symbolSize: optionsSetup.symbolSize,
+        color: optionsSetup.symbolColor,
+      };
+      series['effect'] = effect;
+    },
+    setSymbol(optionsSetup) {
+      let symbol;
+      if (optionsSetup.symbol == 'plane') {
+        symbol = planePath;
+      } else {
+        symbol = "arrow";
+      }
+      return symbol;
+    },
+    setPeriod(optionsSetup){
+      let period;
+      if (optionsSetup.symbol == 'plane') {
+        period = optionsSetup.symbolPeriod - 1;
+      }else {
+        period = optionsSetup.symbolPeriod;
+      }
+      return period;
+    },
+    // 点设置
     setOptionsPoint() {
       const optionsSetup = this.optionsSetup;
       const series = this.options.series[2];
@@ -362,6 +396,21 @@ export default {
       };
       series["itemStyle"] = itemStyle;
     },
+    // 线设置
+    setOptionsLine() {
+      const optionsSetup = this.optionsSetup;
+      const series = this.options.series[1];
+      const lineStyle = {
+        normal: {
+          // 线条颜色
+          color: optionsSetup.lineColor,
+          width: optionsSetup.lineWidth,
+          opacity: 0.4,
+          curveness: 0.2
+        }
+      };
+      series['lineStyle'] = lineStyle;
+    },
     // 地图颜色设置
     setOptionsColor() {
       const optionsSetup = this.optionsSetup;