maptalks常用代码

图层置顶 置底
 layer.show().bringToFront();
 layerDynamic.bringToBack();

清空所有图层

//所有图层的id
let layerscf: [
        "qyfb0",
        "qyfb1",
        "fxdfb0",
        "fxdfb1",
        "fxdfb2",
        "fxdfb3",
        "yhdfb1",
        "yhdfb0",
        "yjllfb1",
        "yjllfb2",
        "yjllfb3",
        "yjllfb_fire"
      ]
  HideAllLayer() {
      // debugger
      let that = this;
      that.layerscf.forEach(item => {
        let layer = this.map.getLayer(item);
        if (layer) {
          if (layer.isVisible()) {
            layer.hide();
          }
          layer.hide();
        }
      });
    },

添加图层并显示

 //添加图层并显示
    AddZhptLayer(id) {
      let layer = this.map.getLayer(id);
      if (layer) {
        if (layer.isVisible()) {
          return layer;
        }
        layer.show();
        // this.showLabels(layer);
      } else {
        layer = new maptalks.VectorLayer(id).addTo(this.map);
      }
      return layer;
    },

添加标注

//添加标注
    AddMarker(id, data, location, withEvent, hasDetail, layer, icon) {
      let that = this;
      const markerFile = !icon ? "common.png" : icon;
      const marker = new maptalks.Marker(location, {
        id: data.OBJECTID,
        symbol: {
         markerWidth: {
                stops: [
                  [12, 25],
                  [13, 25],
                  [14, 30],
                  [15, 30],
                  [17, 35],
                  [18, 40],
                  [19, 40]
                ]
              },
              markerHeight: {
                stops: [
                  [12, 25],
                  [13, 25],
                  [14, 30],
                  [15, 30],
                  [17, 35],
                  [18, 40],
                  [19, 40]
                ]
              },
          markerFile: require(`../../../../static/safeProduct/map/${markerFile}`)
        },
        properties: data
      });
      // console.log(withEvent, "withEvent");
      if (withEvent) {
          marker.on("click mouseover mouseout", function(e) {
            if (e.type == "mouseover") {
              MapEngine.setInfoWindow(
                e.target,
                null,
                id,
                false,
                null,
                null,
                null,
                true
              );
            } else if (e.type == "mouseout") {
              e.target.closeInfoWindow();
            } else if (e.type == "click") {
              that.currentSItem = e.target.getProperties();
              //点击放大
              // that.showModel = true;
              that.paramsList.CamList = that.currentSItem.indexCode;
              // that.OpenPlayer(that.currentSItem);
              that.play();
            }
          });
        }
      layer.addGeometry(marker);
    },
给点加弹框
let html = '
'; html += '
车辆监控
X
'
; html += '
'
; //图片 html += '
+item.picPlate+'"/>
'
; //内容 html += '

' + "过车时间" + '' + item.passTimeStr+ '

'
; html += '

' + "卡口名称" + '' + item.tollgates.name+ '

'
; html += '

' + "车牌号码" + '' + item.plateInfo+ '

'
; html += '

' + "车牌颜色" + '' + myColor + '

'
; //车辆轨迹 html += '

查看轨迹

'
; html += '
'; let infoWindow = new maptalks.ui.InfoWindow({ custom: true, content: html, autoOpenOn: null, // autoCloseOn:'click', dy: 15, dx: 0 }).addTo(camera3) camera3.openInfoWindow(); document.getElementById('closeInfoWin').onclick = function () { camera3.closeInfoWindow(); }

切换底图

 // 地图切换
    mapChange(item) {
      // console.log(config.MapServiceUrl)
      // debugger;
      if (item == "2.5D") {
        MapEngine.setBaseMap(
          "yx_map",
          config.MapServiceUrl.tileLayerUrl.yxMapUrl
        );
        MapEngine.addTileLayer2(
          "hdzj_map",
          config.MapServiceUrl.tileLayerUrl.LG25DAnnotationUrl
        );
        MapEngine.addTileLayer2(
          "hd_map",
          config.MapServiceUrl.tileLayerUrl.D25MapUrl
        );
      } else {
        MapEngine.removelayer("hd_map");
        MapEngine.removelayer("hdzj_map");
        if (item == "矢量") {
          MapEngine.setBaseMap(
            "vec_map",
            config.MapServiceUrl.tileLayerUrl.LGMapUrl
          );
        } else if (item == "影像") {
          MapEngine.setBaseMap(
            "img_map",
            config.MapServiceUrl.tileLayerUrl.yxMapUrl
          );
        }
      }

你可能感兴趣的:(webgis)