五大图层可视化

src/views/modules/visual/communityGovern/fivelayers/mapIndex.vue

@@ -573,11 +573,11 @@ const vueGis = {
         colList: [
           {
             align: "center",
-            width: "5%",
+            width: "25%",
           },
           {
             align: "center",
-            width: "10%",
+            width: "75%",
           },
 
         ],
@@ -736,7 +736,7 @@ const vueGis = {
           return feature;
         });
         if (feature) {
-          console.log(feature)
+          // console.log(feature)
           _that.clickMapVolunteer(feature.values_.properties.info)
 
         }
@@ -1054,7 +1054,7 @@ const vueGis = {
       } else {
         document.getElementById("popup-goMore").style.display = 'none'
       }
-      console.log(this.overlay.getElement())
+      // console.log(this.overlay.getElement())
       let content = document.getElementById("popup-content");
       this.overlay.getElement().style.display = 'block'
       this.overlay.getElement().parentNode.style.display = 'block'
@@ -1166,8 +1166,8 @@ const vueGis = {
         }
 
 
-        console.log(this.categoryListshow)
+        // console.log(this.categoryListshow)
-        console.log(this.categoryList)
+        // console.log(this.categoryList)
 
       } else {
         this.$message.error(msg)
@@ -1177,8 +1177,8 @@ const vueGis = {
     //加载组织数据
     async getTable (isPage) {
       // this.demand.loading = true
-      const url = "/data/aggregator/coverage/dataList";
+      // const url = "/data/aggregator/coverage/dataList";
-      // const url = "http://yapi.elinkservice.cn/mock/245/data/aggregator/coverage/dataList";
+      const url = "http://yapi.elinkservice.cn/mock/245/data/aggregator/coverage/dataList";
       let params = {
         coverageTypes: this.coverageTypes,
         categoryKeys: this.categoryKeys,
@@ -1194,48 +1194,61 @@ const vueGis = {
       if (code === 0) {
 
         this.demand.total = data.total;
+
+        data.list = [
+          {
+            categoryKey: "resi_xfry",
+            content: "信访人员",
+            id: "123",
+            latitude: "36.082230",
+            longitude: "120.3868167667315",
+            placeType: 'resi'
+          },
+          {
+            categoryKey: "sr_gy",
+            content: "公园",
+            id: "123",
+            latitude: "36.062227",
+            longitude: "120.389455",
+            placeType: 'public_service'
+          },
+          {
+            categoryKey: "ep_scjgqy",
+            content: "生产加工企业",
+            id: "123",
+            latitude: "36.072214",
+            longitude: "120.389455",
+            placeType: 'dangerous_chemicals'
+          },
+          {
+            categoryKey: "ps_wss",
+            content: "卫生所（室）",
+            id: "123",
+            latitude: "36.07394505338441",
+            longitude: "120.3868167667315",
+            placeType: 'city_management'
+          }
+        ]
         this.tableList = data.list
-        // this.tableList = [
+        this.demand.list = data.list
-        //   {
+        this.demand.list.forEach(item => {
-        //     categoryKey: "resi_xfry",
+          item.imgObj = {
-        //     content: "信访人员",
+            type: 'img',
-        //     id: "123",
+            src: this.iconUrlArray[item.categoryKey]
-        //     latitude: "36.082230",
+          }
-        //     longitude: "120.3868167667315",
+        });
-        //     placeType: 'resi'
+
-        //   },
+
-        //   {
+        this.demand.list = this.demand.list.map((item) => {
-        //     categoryKey: "sr_gy",
-        //     content: "公园",
-        //     id: "123",
-        //     latitude: "36.062227",
-        //     longitude: "120.389455",
-        //     placeType: 'public_service'
-        //   },
-        //   {
-        //     categoryKey: "ep_scjgqy",
-        //     content: "生产加工企业",
-        //     id: "123",
-        //     latitude: "36.072214",
-        //     longitude: "120.389455",
-        //     placeType: 'dangerous_chemicals'
-        //   },
-        //   {
-        //     categoryKey: "ps_wss",
-        //     content: "卫生所（室）",
-        //     id: "123",
-        //     latitude: "36.07394505338441",
-        //     longitude: "120.3868167667315",
-        //     placeType: 'city_management'
-        //   }
-        // ]
-        this.demand.list = data.list.map((item) => {
           return [
-            item.categoryKey ? item.categoryKey : '--',
+            // item.categoryKey ? item.categoryKey : '--',
+
+            item.imgObj,
             item.content ? item.content : '',
 
           ];
         });
+        console.log(this.demand.list)
       } else {
         this.$message.error(msg);
       }
@@ -1243,8 +1256,8 @@ const vueGis = {
     //加载组织数据
     async getMapTable () {
 
-      const url = "/data/aggregator/coverage/dataList";
+      // const url = "/data/aggregator/coverage/dataList";
-      // const url = "http://yapi.elinkservice.cn/mock/245/data/aggregator/coverage/dataList";
+      const url = "http://yapi.elinkservice.cn/mock/245/data/aggregator/coverage/dataList";
       let params = {
         coverageTypes: this.coverageTypes,
         categoryKeys: this.categoryKeys,
@@ -1296,7 +1309,7 @@ const vueGis = {
           item.url = this.iconUrlArray[item.categoryKey]
 
         });
-        console.log(this.iconArrays)
+        // console.log(this.iconArrays)
         this.loadIcon()
       } else {
         this.$message.error(msg);
@@ -1604,7 +1617,7 @@ const vueGis = {
           'features': featureData
         };
         let feature = (new GeoJSON()).readFeatures(geojsonObject)
-        console.log(geojsonObject)
+        // console.log(geojsonObject)
 
         polygonSource.addFeatures(feature)
 

src/views/modules/visual/cpts/tb.vue

@@ -29,6 +29,14 @@
             <div v-if="typeof item === 'string' || typeof item === 'number'">
               {{ item }}
             </div>
+
+            <div v-if="typeof item === 'object'&& item.type === 'img'">
+              <!-- <span>{{  item.type+  item.src}}</span> -->
+              <img style="width:18px;height:18px"
+                   :src="item.src"
+                   alt="" />
+
+            </div>
             <div v-if="typeof item === 'object' && item && item.type == 'index'">
               <img v-if="highlightTop3 && index == 0"
                    src="@/assets/img/shuju/top/1.png"