Forráskód Böngészése

feat--气泡地图增加提示语配置

qianming 2 éve
szülő
commit
13007cb248

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

@@ -291,6 +291,27 @@ export const widgetAirbubbleMap = {
             },
           ],
         },
+        {
+          name: '提示语设置',
+          list: [
+            {
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'tipsFontSize',
+              required: false,
+              placeholder: '',
+              value: 16
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'tipsColor',
+              required: false,
+              placeholder: '',
+              value: '#00FEFF'
+            },
+          ],
+        },
       ],
     ],
     data: [

+ 23 - 2
report-ui/src/views/bigscreenDesigner/designer/widget/map/widgetAirBubbleMap.vue

@@ -448,7 +448,8 @@ export default {
       //this.setOptionDataValue();
       this.setOptionsData();
       this.setOptionAirSize();
-      this.setOptionMapBlocak();
+      this.setOptionsTooltip();
+      this.setOptionMapBlock();
     },
     // 标题设置
     setOptionsTitle() {
@@ -484,7 +485,7 @@ export default {
       };
       label["normal"] = normal;
     },
-    setOptionMapBlocak() {
+    setOptionMapBlock() {
       const optionsSetup = this.optionsSetup;
       const itemStyle = this.options.series[0]["itemStyle"];
       const normal = {
@@ -534,6 +535,26 @@ export default {
       maxSize4Pin = this.optionsSetup.fontmaxSize4Pin;
       minSize4Pin = this.optionsSetup.fontminSize4Pin;
     },
+    // tooltip 设置
+    setOptionsTooltip() {
+      const optionsSetup = this.optionsSetup;
+      const tooltip = {
+        trigger: "item",
+        show: true,
+        textStyle: {
+          color: optionsSetup.tipsColor,
+          fontSize: optionsSetup.tipsFontSize,
+        },
+        formatter: function (params) {
+          if (params.value.length > 1) {
+            return params.data.name + "" + params.data.value[2];
+          } else {
+            return params.name;
+          }
+        },
+      };
+      this.options.tooltip = tooltip;
+    },
     //数据解析
     setOptionsData(e, paramsConfig) {
       const optionsData = this.optionsData; // 数据类型 静态 or 动态