+主图

liuyg

2021-12-27 7c55464ad98984e50201bdd43ecda7de93082ecd

+主图

 src/components/mobileLeftNav/index.vue

@@ -56,20 +56,6 @@
      imgStyle: {
        right: "0",
      },
      //   coutrolStyle: {
      //     position: " absolute",
      //     left: "-26px",
      //     top: "114px",
      //     right: "auto",
      //     width: "25px",
      //     height: "60px",
      //     backgroundColor: "#fff",
      //     borderRadius: "10px",
      //     display: "flex",
      //     alignItems: "center",
      //     justifyContent: "center",
      //     transition: "left 3s",
      //   },
      leftNavData: [
        {
          flag: false,
@@ -111,7 +97,7 @@
          checked: "/img/leftnav/monitor-checked.png",
          layer: "videoLayer",
          methods: getListVideo,
          imgSrc: "img/leftnav/map-panorama.png",
          imgSrc: "/img/leftnav/map-monitor.png",
          // imgSrc: "img/mobile/blue.png",
        },
        // {
@@ -181,15 +167,6 @@
    changeIconHide() {
      let isif = this.iconHide;
      this.$store.commit("MSET_ICONHIDE", !isif);
    },
    generatePosition(num) {
      const list = [];
      for (let i = 0; i < num; i++) {
        const lng = 121.0493 + Math.random() * 0.5;
        const lat = 31.2583 + Math.random() * 0.5;
        list.push(new this.DC.Position(lng, lat, 0));
      }
      return list;
    },
    leftNavClick(item) {
      //判断并关闭已开启标签
@@ -266,203 +243,6 @@
      this.comeLayer = new this.DC.HtmlLayer("comeLayer");
      viewer.addLayer(this.comeLayer);

      // const positions1 = this.generatePosition(4);
      // positions1.forEach((item, index) => {
      //   const divIcon = new this.DC.DivIcon(
      //     item,
      //     `
      //                   <div class="tag-entitys-box">
      //                       <div class="tag-content">
      //                           南门口
      //                       </div>
      //                       <div class="tag-angle-content">
      //                           <img src="https://map.hit.edu.cn/images/tarrow_xq.png">
      //                       </div>
      //                   </div>
      //               `
      //   );
      //   //  e.overlay._position._lng,
      //   //       e.overlay._position._lat - 0.012,
      //   //订阅事件1
      //   divIcon.on(DC.MouseEventType.CLICK, (e) => {
      //     // 定制化窗体
      //     that.openPopupS(
      //       e.position,
      //       [e.overlay._position._lng, e.overlay._position._lat],
      //       { name: "标签" }
      //     );
      //   });
      //   this.tagLayer.addOverlay(divIcon); //标签
      // });
      // this.tagLayer["positions"] = positions1;

      // const positions2 = this.generatePosition(50);
      // positions2.forEach((item, index) => {
      //   const divIcon = new this.DC.DivIcon(
      //     item,
      //     `
      //                   <div  class="way-entitys-box">
      //                       <div  class="way-title" style="border: white 1px solid; padding-left: 2px;font-size: 12px; background: #0066ff;  width: 12px;line-height: 13px; padding:2px 1px 2px 1px; color:white;">
      //                           工建街
      //                       </div>
      //                       <div  class="way-sign-box">
      //                           <img src="https://map.hit.edu.cn/images/roadsign3.png">
      //                       </div>
      //                   </div>
      //               `
      //   );
      //   //订阅事件2
      //   divIcon.on(DC.MouseEventType.CLICK, (e) => {
      //     // 定制化窗体
      //     that.openPopupS(
      //       e.position,
      //       [e.overlay._position._lng, e.overlay._position._lat],
      //       { name: "道路" }
      //     );
      //   });
      //   this.wayLayer.addOverlay(divIcon); //道路
      // });
      // this.wayLayer["positions"] = positions2;

      // const positions3 = this.generatePosition(50);
      // positions3.forEach((item) => {
      //   const billboard = new this.DC.Billboard(
      //     item,
      //     "/img/leftnav/map-panorama.png"
      //   );
      //   billboard.size = [16, 16];
      //   //订阅事件3
      //   billboard.on(DC.MouseEventType.CLICK, (e) => {
      //     // 定制化窗体
      //     that.openPopupS(
      //       e.position,
      //       [e.wgs84Position.lng, e.wgs84Position.lat],
      //       { name: "实景" }
      //     );
      //   });
      //   this.sceneLayer.addOverlay(billboard); //实景
      // });
      // this.sceneLayer["positions"] = positions3;

      // const positions10 = this.generatePosition(50);
      // positions10.forEach((item) => {
      //   const label = new this.DC.Label(item, "活动");
      //   label.setStyle({
      //     fillColor: this.DC.Color.ORANGERED,
      //     font: "10px sans-serif",
      //     pixelOffset: { x: 0, y: -16 },
      //   });
      //   this.activityLayer.addOverlay(label);

      //   const billboard = new this.DC.Billboard(
      //     item,
      //     "/img/leftnav/map-aed.png"
      //     // "/img/leftnav/map-panorama.png"
      //   );
      //   billboard.size = [16, 16];
      //   //订阅事件10
      //   billboard.on(DC.MouseEventType.CLICK, (e) => {
      //     // 定制化窗体
      //     that.openPopupS(
      //       e.position,
      //       [e.wgs84Position.lng, e.wgs84Position.lat],
      //       { name: "活动" }
      //     );
      //   });
      //   this.activityLayer.addOverlay(billboard); //活动
      // });
      // this.activityLayer["positions"] = positions10;

      // const positions4 = this.generatePosition(10);
      // positions4.forEach((item, index) => {
      //   const label = new this.DC.Label(item, "建筑AED");
      //   label.setStyle({
      //     fillColor: this.DC.Color.ORANGERED,
      //     font: "10px sans-serif",
      //     pixelOffset: { x: 0, y: -16 },
      //   });
      //   this.aedLayer.addOverlay(label);

      //   const billboard = new this.DC.Billboard(
      //     item,
      //     "/img/leftnav/map-aed.png"
      //   );
      //   billboard.size = [16, 16];
      //   //订阅事件4
      //   billboard.on(DC.MouseEventType.CLICK, (e) => {
      //     // 定制化窗体
      //     that.openPopupS(
      //       e.position,
      //       [e.wgs84Position.lng, e.wgs84Position.lat],
      //       { name: "建筑AED" }
      //     );
      //   });
      //   this.aedLayer.addOverlay(billboard); //AED
      // });
      // this.aedLayer["positions"] = positions4;

      // const positions5 = this.generatePosition(120);
      // positions5.forEach((item, index) => {
      //   const divIcon = new this.DC.DivIcon(
      //     item,
      //     `
      //                   <div class="park-entitys-box">
      //                       <div class="park-title" alt="校外街路侧停车场">
      //                       </div>
      //                       <div class="park-sign-box">
      //                           <div>
      //                               <img src="https://map.hit.edu.cn/images/p-biao.png" width="14" height="14" alt="校外街路侧停车场" title="校外街路侧停车场">
      //                           </div>
      //                           <div>
      //                               <img src="https://map.hit.edu.cn/images/roadsign.png" width="5" height="21">
      //                           </div>
      //                       </div>
      //                   </div>
      //               `
      //   );
      //   //订阅事件5
      //   divIcon.on(DC.MouseEventType.CLICK, (e) => {
      //     // 定制化窗体
      //     that.openPopupS(
      //       e.position,
      //       [e.overlay._position._lng, e.overlay._position._lat],
      //       { name: "校外街路侧停车场" }
      //     );
      //   });
      //   this.parkLayer.addOverlay(divIcon);
      // });
      // this.parkLayer["positions"] = positions5;

      // const positions6 = this.generatePosition(10);

      // positions6.forEach((item, index) => {
      //   const label = new this.DC.Label(item, "123");
      //   label.setStyle({
      //     fillColor: this.DC.Color.PURPLE,
      //     outlineColor: this.DC.Color.WHITE, // 边框颜色
      //     outlineWidth: 2, // 边框大小，
      //     font: "10px sans-serif",
      //     pixelOffset: { x: 0, y: -16 },
      //   });
      //   this.comeLayer.addOverlay(label);

      //   const billboard = new this.DC.Billboard(
      //     item,
      //     "/img/leftnav/map-activity.png"
      //   );
      //   billboard.size = [16, 16];
      //   //订阅事件6
      //   billboard.on(DC.MouseEventType.CLICK, (e) => {
      //     // 定制化窗体
      //     that.openPopupS(
      //       e.position,
      //       [e.wgs84Position.lng, e.wgs84Position.lat],
      //       { name: "123" }
      //     );
      //   });
      //   this.comeLayer.addOverlay(billboard); //出入
      // });
      // this.comeLayer["positions"] = positions6;
      let ourNum = that.leftNavData.length;
      for (let n = 0; n < ourNum; n++) {
        let ourD = this.leftNavData[n];

 src/components/mobilemap/index.vue

@@ -144,9 +144,17 @@

      popup.hide();

      const baselayer = DC.ImageryLayerFactory.createArcGisImageryLayer({
        url: "http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer",
      });
      // const baselayer = DC.ImageryLayerFactory.createArcGisImageryLayer({
      //   url: "http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer",
      // });
      const baselayer = that.DC.ImageryLayerFactory.createImageryLayer(
        that.DC.ImageryType.XYZ,
        {
          // url: 'https://webmap-tile.sf-express.com/MapTileService/rt?x={col}&y={row}&z={level}'

          url: "https://webmap-tile.sf-express.com/MapTileService/rt?fetchtype=static&x={x}&y={y}&z={z}&project=sfmap&pic_size=256&pic_type=png8&data_name=361100&data_format=merged-dat&data_type=normal", // 行政区划
        }
      );
      viewer.addBaseLayer(baselayer, {
        iconUrl: "examples/images/icon/img.png",
        name: "影像",