public/static/config/config.js

@@ -16,6 +16,7 @@ var webConfig = {
     PROXY_URL: "/proxy_proxy",
     KDYJS_URL: "/proxy_kdyjs",
     TDT_URL: "https://{s}.tianditu.gov.cn/",
+    ZWDT_PROXY_URL: "/proxy_zwdt",
     modelArr: [
         "http://121.43.55.7:65456/xyjd/jz/tileset.json",
         "http://121.43.55.7:65456/xyjd/dm/tileset.json"

src/components/Map.vue

@@ -215,93 +215,28 @@ export default {
       return this.mapLoaded;
     },
     addBaseMap() {
-      // let layer1 = viewer.imageryLayers.addImageryProvider(
-      //   new SkyScenery.CGCS2000ArcGisMapServerImageryProvider({
-      //     url: webConfig.yxt
-      //   })
-      // );
-      // layer1.show = false;
-      // let layer2 = viewer.imageryLayers.addImageryProvider(
-      //   new SkyScenery.CGCS2000ArcGisMapServerImageryProvider({
-      //     url: webConfig.yxt_zj
-      //   })
-      // );
-      // layer2.show = false;
-      // let layer3 = viewer.imageryLayers.addImageryProvider(
-      //   new SkyScenery.CGCS2000ArcGisMapServerImageryProvider({
-      //     url: webConfig.xht
-      //   })
-      // );
-
-      // let layer1 = this.addTDT("img")
-      // viewer.imageryLayers.addImageryProvider(
-      //   // LAYER=img&tileMatrixSet=w&service=wmts&version=1.0.0&request=GetTile&style=default&format=tiles&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&
-      //   new SkyScenery.WebMapTileServiceImageryProvider({
-      //     url: "http://{s}.tianditu.com/img_w/wmts?tk=f74e6c0cc247c42af05f7053e0b5fb9b",
-      //     layer: "img",
-      //     style: "default",
-      //     format: "tiles",
-      //     tileMatrixSetID: "w",
-      //     subdomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],
-      //     minimumLevel: 1,
-      //     maximumLevel: 18,
-      //     tilingScheme: new SkyScenery.WebMercatorTilingScheme()
-      //   })
-      // );
-      // layer1.show = false;
-      // let layer2 = viewer.imageryLayers.addImageryProvider(
-      //   new SkyScenery.WebMapTileServiceImageryProvider({
-      //     url: "http://t6.tianditu.com/cia_w/wmts?LAYER=cia&tileMatrixSet=w&service=wmts&version=1.0.0&request=GetTile&style=default&format=tiles&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&tk=f74e6c0cc247c42af05f7053e0b5fb9b",
-      //     maximumLevel: 19
-      //   })
-      // );
-      // layer2.show = false;
-      // let layer3 = viewer.imageryLayers.addImageryProvider(
-      //   new SkyScenery.WebMapTileServiceImageryProvider({
-      //     url: "http://t6.tianditu.com/vec_w/wmts?LAYER=vec&tileMatrixSet=w&service=wmts&version=1.0.0&request=GetTile&style=default&format=tiles&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&tk=f74e6c0cc247c42af05f7053e0b5fb9b",
-      //     layer: "vec",
-      //     style: "default",
-      //     format: "tiles",
-      //     tileMatrixSetID: "w",
-      //     subdomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],
-      //     minimumLevel: 1,
-      //     maximumLevel: 18,
-      //     tilingScheme: new SkyScenery.WebMercatorTilingScheme()
-      //   })
-      // );
-      // layer3.show = true;
-      // let layer4 = viewer.imageryLayers.addImageryProvider(
-      //   // LAYER=cva&tileMatrixSet=w&service=wmts&version=1.0.0&request=GetTile&style=default&format=tiles&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&
-      //   new SkyScenery.WebMapTileServiceImageryProvider({
-      //     url: "http://t6.tianditu.com/cva_w/wmts?tk=f74e6c0cc247c42af05f7053e0b5fb9b",
-      //     layer: "cva",
-      //     style: "default",
-      //     format: "tiles",
-      //     tileMatrixSetID: "w",
-      //     subdomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],
-      //     minimumLevel: 1,
-      //     maximumLevel: 18,
-      //     tilingScheme: new SkyScenery.WebMercatorTilingScheme()
-      //   })
-      // );
-      // layer4.show = true;
-
       let layer1 = this.addTDT("img")
       let layer2 = this.addTDT("cia")
       let layer3 = this.addTDT("vec")
       let layer4 = this.addTDT("cva")
+      //   // shmap_blue_web	暗蓝色底图（互联网）
+      //   // shmap_grey_web	浅灰色底图（互联网）
+      //   // shmap_normal_web	标准版底图（互联网）
+      //   // shmap_base_web	常规色底图（互联网）
+      // let layer3 = this.addZWDT("shmap_base_web")
+
 
       layer1.show = false;
       layer2.show = false;
       layer3.show = true;
       layer4.show = true;
 
-
       this.baseMapObj.yxt = layer1;
       this.baseMapObj.yxt_zj = layer2;
       this.baseMapObj.xht = layer3;
-      this.baseMapObj.xht_zj = layer4;
+      this.baseMapObj.xht_zh = layer4;
     },
+    // TDT
     addTDT(type) {
       return viewer.imageryLayers.addImageryProvider(
         new SkyScenery.WebMapTileServiceImageryProvider({
@@ -318,7 +253,33 @@ export default {
       );
     },
 
+    // ZWDT
+    addZWDT(type) {
+      let token = localStorage.getItem(webConfig.AUTH_USER_TOKEN_KEY);
+      return viewer.imageryLayers.addImageryProvider(
+        // CGCS2000ArcGisMapServerImageryProvider
+        new SkyScenery.ArcGisMapServerImageryProvider({
+          url: webConfig.ZWDT_PROXY_URL + "/internal_map/?servertype=" + type + "&proxyToken=" + token,
+        })
+      );
+    },
     changeBaseMap(param) {
+      // // TDT
+      // switch (param.type) {
+      //   case "yxt":
+      //     this.baseMapObj.yxt.show = true;
+      //     this.baseMapObj.yxt_zj.show = true;
+      //     this.baseMapObj.xht.show = false;
+      //     this.baseMapObj.xht_zj.show = false;
+      //     break;
+      //   case "xht":
+      //     this.baseMapObj.yxt.show = false;
+      //     this.baseMapObj.yxt_zj.show = false;
+      //     this.baseMapObj.xht.show = true;
+      //     this.baseMapObj.xht_zj.show = true;
+      //     break;
+      // }
+      // ZWDT
       switch (param.type) {
         case "yxt":
           this.baseMapObj.yxt.show = true;
@@ -330,7 +291,7 @@ export default {
           this.baseMapObj.yxt.show = false;
           this.baseMapObj.yxt_zj.show = false;
           this.baseMapObj.xht.show = true;
-          this.baseMapObj.xht_zj.show = true;
+          this.baseMapObj.xht_zj.show = true
           break;
       }
     },

src/views/HomeView.vue

@@ -98,6 +98,16 @@
         </el-scrollbar>
       </div>
     </div>
+    <div class="tjdwInfoDialog" v-show="tjdwInfoDialogShow">
+      <div class="close" @click="closeTJDW">×</div>
+      <div class="content" v-if="nowPoint != null">
+        <el-scrollbar>
+          <div class="item">地址：{{ nowPoint.properties["推荐点"] }}</div>
+          <div class="item">推荐理由：{{ nowPoint.properties["推荐理由"] }}</div>
+          <div class="item">星级：{{ nowPoint.properties["星级"] }}</div>
+        </el-scrollbar>
+      </div>
+    </div>
     <!-- 此处弹框样式写在App.vue中 -->
     <el-dialog class="yhfkInfoDialog" title="用户反馈" header-class="yhfkInfoDialogHeader"
       footer-class="yhfkInfoDialogfooter" v-model="yhfkInfoDialogShow" :close="closeKZDP" :close-on-click-modal="false"
@@ -122,7 +132,6 @@
     </el-dialog>
   </div>
 </template>
-
 <script>
 
 
@@ -209,7 +218,9 @@ export default {
         ],
       },
       isShowZXQ: false,
-      zxqUrl: webConfig.zxqUrl
+      zxqUrl: webConfig.zxqUrl,
+      pointRecommendArr: [],
+      tjdwInfoDialogShow: false,
     };
   },
   mounted() {
@@ -230,9 +241,21 @@ export default {
       // if (event.source !== window.parent) {
       //   return;
       // }
-
       // 处理接收到的消息数据
       const data = event.data;
+      if (data != null) {
+        if (data.knowledge_ids.length != 0) {
+          let pointArr = JSON.parse(data.knowledge_ids)["推荐清单"];
+          console.log(pointArr);
+          this.addRecommendPoint(pointArr);
+          // latitude
+          // longitude
+          // 推荐点
+          // 推荐理由
+          // 星级
+        }
+        return
+      }
       // const imgUrl = data.imgUrl;
       // const otherParam = data.otherParam;
 
@@ -355,6 +378,49 @@ export default {
     closeZXQ() {
       this.zxqIframeContainer ='zxqIframeContainer-mb-mx'
       this.isShowZXQ = false
+      this.clearRecommendPoint();
+    },
+    // 加载 智小青 推荐的点位
+    addRecommendPoint(pointArr) {
+      this.clearRecommendPoint();
+      this.pointRecommendArr = pointArr.map(function (pointInfo) {
+        return viewer.entities.add(new SkyScenery.Entity({
+          position: SkyScenery.Cartesian3.fromDegrees(pointInfo.longitude, pointInfo.latitude),
+          type: "tjdw",
+          info: {
+            coor: [pointInfo.longitude, pointInfo.latitude],
+            properties: {
+              "推荐点": pointInfo["推荐点"],
+              "推荐理由": pointInfo["推荐理由"],
+              "星级": pointInfo["星级"],
+            }
+          },
+          billboard: {
+            width: 48,
+            height: 48,
+            image: "./static/image/tjdw.png",
+            scale: 1,
+            horizontalOrigin: SkyScenery.HorizontalOrigin.CENTER,
+            verticalOrigin: SkyScenery.VerticalOrigin.BOTTOM,
+          }
+        }));
+      })
+      this.pointTCHandle();
+    },
+    // 清除 智小青 推荐的点位
+    clearRecommendPoint() {
+      if (this.pointRecommendArr.length > 0) {
+        this.pointRecommendArr.map(function (point) {
+          viewer.entities.remove(point)
+        })
+        this.pointRecommendArr = []
+      }
+      this.closeTJDW();
+    },
+    // 关闭 智小青 推荐的点位 弹窗
+    closeTJDW() {
+      this.tjdwInfoDialogShow = false;
+      this.nowPoint = null
     },
     // 沿街店铺
     addyjdp() {
@@ -483,6 +549,13 @@ export default {
               let xy = that.lonlatConvertToScreenXY(entity.info.coor)
               document.querySelector(".kzdpInfoDialog").style.top = (xy.y - 250) + "px";
               document.querySelector(".kzdpInfoDialog").style.left = (xy.x - 150) + "px";
+            } else if (entity.type == "tjdw") {
+              that.tjdwInfoDialogShow = true
+              that.nowPoint = entity.info;
+              that.nowPoint["type"] = "tjdw";
+              let xy = that.lonlatConvertToScreenXY(entity.info.coor)
+              document.querySelector(".tjdwInfoDialog").style.top = (xy.y - 250) + "px";
+              document.querySelector(".tjdwInfoDialog").style.left = (xy.x - 150) + "px";
             }
             that.$refs.kdyjs.clickPointJGTL({
               lon: entity.info.coor[0],
@@ -499,7 +572,7 @@ export default {
         }, SkyScenery.ScreenSpaceEventType.LEFT_CLICK);
         viewer.scene.postRender.addEventListener(this.updatePosition, this);
       } else {
-        if (this.yjdpShow == false && this.kzdpShow == false) {
+        if (this.yjdpShow == false && this.kzdpShow == false && this.isShowZXQ == false) {
           toRaw(this.mapHandle).destroy();
           this.mapHandle = null
           viewer.scene.postRender.removeEventListener(this.updatePosition, this);
@@ -519,6 +592,9 @@ export default {
             } else if (obj.type == "kzdp") {
               document.querySelector(".kzdpInfoDialog").style.top = "-9999px";
               document.querySelector(".kzdpInfoDialog").style.left = "-9999px";
+            } else if (obj.type == "tjdw") {
+              document.querySelector(".tjdwInfoDialog").style.top = "-9999px";
+              document.querySelector(".tjdwInfoDialog").style.left = "-9999px";
             }
 
           } else {
@@ -528,6 +604,9 @@ export default {
             } else if (obj.type == "kzdp") {
               document.querySelector(".kzdpInfoDialog").style.top = (xy.y - 250) + "px";
               document.querySelector(".kzdpInfoDialog").style.left = (xy.x - 150) + "px";
+            } else if (obj.type == "tjdw") {
+              document.querySelector(".tjdwInfoDialog").style.top = (xy.y - 300) + "px";
+              document.querySelector(".tjdwInfoDialog").style.left = (xy.x - 150) + "px";
             }
 
           }
@@ -1295,6 +1374,39 @@ export default {
 
   }
 
+  .tjdwInfoDialog {
+    position: absolute;
+    top: 0px;
+    left: 0px;
+    width: 300px;
+    height: 250px;
+    background: #01346f99;
+    border-radius: 10px;
+
+    .close {
+      font-size: 24px;
+      position: absolute;
+      top: 6px;
+      right: 8px;
+      line-height: 24px;
+      width: 24px;
+      height: 24px;
+      cursor: pointer;
+      color: #ffffff;
+    }
+
+    .content {
+      height: 210px;
+      color: #ffffff;
+      margin: 30px 0px 10px 20px;
+
+      .item {
+        line-height: 30px;
+        margin-right: 20px;
+      }
+    }
+  }
+
   .zxqIframeContainer {
     position: absolute;
     top: 100px;

vue.config.js

@@ -118,6 +118,13 @@ module.exports = defineConfig({
           '^/proxy_dms': ''
         }
       },
+      '/proxy_zwdt': {
+        target: 'https://szlszxdt.qpservice.org.cn/',
+        changeOrigin: true,
+        pathRewrite: {
+          '^/proxy_zwdt': ''
+        }
+      },
     },
   }
 })