leaflet使用已经创建的临时图层过滤展示

星良辰寻

于 2023-11-30 13:48:35 发布

阅读量205

点赞数

分类专栏： leaflet 文章标签： leaflet

本文链接：https://blog.csdn.net/josiecici/article/details/134710516

版权

leaflet 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

<template>
  <div id="map">

  </div>
</template>

<script>
import L from 'leaflet';
import { TiledMapLayer } from '@supermap/iclient-leaflet';
import { TiandituTileLayer } from '@supermap/iclient-leaflet';
import { TianDiTu_WGS84CRS } from "@supermap/iclient-leaflet";
import { TianDiTu_MercatorCRS } from "@supermap/iclient-leaflet";
import { TiledVectorLayer } from '@supermap/iclient-leaflet';
import { QueryBySQLParameters } from '@supermap/iclient-leaflet';
import { QueryService } from '@supermap/iclient-leaflet';
import { LayerStatus } from '@supermap/iclient-common/iServer/LayerStatus';
import { SetLayerStatusParameters } from '@supermap/iclient-common/iServer/SetLayerStatusParameters';
import { SetLayerStatusService } from '@supermap/iclient-common/iServer/SetLayerStatusService'
import axios from "axios"
export default {
  name: 'App',
  components: {
  },
  mounted() {
    var map = L.map('map', {
      // crs: TianDiTu_WGS84CRS,
      crs: L.CRS.EPSG4326,
      center: [39, 116],
      maxZoom: 18,
      zoom: 8
    });
    new TiandituTileLayer({
      layerType: 'img',
      key: '1d109683f4d84198e37a38c442d68311'
    }).addTo(map)
    new TiandituTileLayer({
      layerType: 'img',
      isLabel: true,
      key: '1d109683f4d84198e37a38c442d68311'
    }).addTo(map)

    var layer
    let url = "https://iserver.supermap.io/iserver/services/map-jingjin/rest/maps/京津地区土地利用现状图";
    setLayer();
    function setLayer() {
      //子图层属性过滤条件
      var layerStatus = new LayerStatus({
        layerName: "Landuse_R@Jingjin#1",//图层名称
        isVisible: true,//是否可见
        displayFilter: "LANDTYPE='灌丛' "//属性过滤条件
      });
      var setLayerStatusParameters = new SetLayerStatusParameters({
        layerStatusList: [layerStatus],//数组来自上面的layerStatus
        //holdTime:15,//获取或设置资源在服务端保存的时间。
        resourceID: "4e6fdbf1c04c450ea226153885202178_5d18fe0d750142409bb7adf618b45cba"//获取或设置资源服务 ID。
      });
      var setLayerStatusService = new SetLayerStatusService(url, {
        eventListeners: {
          "processCompleted": setLayerCompleted,
          "processFailed": setLayerFailed
        }
      });
      setLayerStatusService.processAsync(setLayerStatusParameters);
    }
    function setLayerCompleted(e) {
      console.log('这是e', e);
      layer = new TiledMapLayer(url, {
        transparent: true,
        cacheEnabled: false,
        redirect: true,
        layersID: "4e6fdbf1c04c450ea226153885202178_5d18fe0d750142409bb7adf618b45cba"
      }, {
        maxResolution: "auto",
        bufferImgCount: 0
      })
      layer.bufferImgCount = 0;
      console.log(layer);
      layer.addTo(map);
    }
    function setLayerFailed(e) {
      console.log(e);
    }
  }
}
</script>

<style>
#map {
  width: 100vw;
  height: 100vh;
}
</style>