Cesium中加载WMS、WMTS、WFS三类服务,并进行点击查询

wms

 newWmsLayer(code = '32006', type = "mine") {
      let CQL_FILTER
      if (type === 'mine') {
        CQL_FILTER = 'mine_code=' + code
      } else {
        CQL_FILTER = 'country_co=' + code
      }

      let [workspace, layer] = process.env.VUE_APP_All_PROJECTS_LAYER.split(':');// 'xys:all-projects'

      let Cesium = getCesium();
      let imageryProvider = new Cesium.WebMapServiceImageryProvider({
        url: getGeoserverApiByTypeName() + '/geoserver/' + workspace + '/wms',
        parameters: {
          service: 'WMS',
          transparent: true, //是否透明
          format: 'image/png',
          srs: 'EPSG:4326',
          styles: '',
          CQL_FILTER,
        },
        layers: workspace + ':' + layer,
        getFeatureInfoParameters: {
          request: "GetFeatureInfo",
          CQL_FILTER
        }
      });

      let imageryLayer = this.viewer.imageryLayers.addImageryProvider(imageryProvider);
      imageryLayer.show = true;// 立即加载
      imageryLayer.code = CQL_FILTER; //
    },
      // 点击事件
      let handler = new Cesium.ScreenSpaceEventHandler(this.viewer.scene.canvas);
      handler.setInputAction((event) => {
        this.onMapClick(event)
      }, Cesium.ScreenSpaceEventType.LEFT_CLICK);

    // 地图点击事件
    onMapClick(event) {
      let viewer = this.viewer
      let pickRay = viewer.camera.getPickRay(event.position);

      viewer.imageryLayers.pickImageryLayerFeatures(pickRay, viewer.scene).then(res => {
        console.log(res[0]?.properties)
      })
    },

其他参考链接
https://blog.csdn.net/yopo_AG/article/details/131538647

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容