首页 / 浏览问题 / WebGIS / 问题详情
在iserver里发布了一个vtpk文件格式的服务,发布服务后,在for MapboxGL 可以正常预览,但是使用leaflet尝试好多也无法加载出来这个图层或者瓦片资源
2EXP 2025年05月21日

这个arcgis切图出来的应该是应该是矢量瓦片资源,我看layers里没有图层

发布服务后 for mapboxGL预览效果

我尝试了好多方法也没显示出来这个

demo1
 

    initMap() {

      //初始化地图

      this.map = L.map('mapContainer', {

        // crs: L.CRS.EPSG4326,

        center: this.$props.center,

        maxZoom: 18,

        minZoom: 4,

        zoom: this.$props.zoom

      });

      L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(this.map);

      // 添加 MVT 图层

      var vectorTileLayer = new L.vectorGrid.protobuf(

        "http://localhost:8090/iserver/services/map-vtpk-NongJiZuoYe/rest/maps/%E5%86%9C%E6%9C%BA%E4%BD%9C%E4%B8%9A/tileFeature.mvt?returnAttributes=true&width=256&height=256&z={z}&x={x}&y={y}",

        {

          crs: L.CRS.EPSG4326,

        }

      ).addTo(this.map);

    },

demo2

    window.require([
      "esri/Map",
      "esri/views/MapView",
      "esri/layers/VectorTileLayer"
    ], (Map, MapView, VectorTileLayer) => {
      const vtLayer = new VectorTileLayer({
        url: "http://localhost:8090/iserver/services/map-world/restjsr/v1/vectortile/maps/World/style.json?f=json"
      });
      const map = new Map({
        basemap: {
          baseLayers: [vtLayer]
        }
      });
      this.view = new MapView({
        container: "viewDiv",
        map: map,
        center: this.$props.center,
        zoom: this.$props.zoom
      });
    });

刚刚接触gis,不知道这个是不是要加载这个矢量瓦片资源信息,麻烦大佬给个回复

1个回答

这个服务是矢量瓦片格式的,可以参考Leaflet加载矢量瓦片的方式,

以“tileFeature.json”出图:https://iclient.supermap.io/examples/leaflet/editor.html#vectorTileLayerNormal

以“tileFeature.mvt”出图:https://iclient.supermap.io/examples/leaflet/editor.html#mvt_mapboxgl

1,271EXP 2025年05月21日

哥,按照你给的案例 现在遇到这个问题,按照这个案例https://iclient.supermap.io/examples/leaflet/editor.html#mvt_mapboxgl 我将github上官方文档代码拉下来以后,换成自己服务链接可以正常夹在出来;;但是 在我自己的vue2项目中使用mapboxgl去加载,矢量瓦片请求直接返回的为 204 No Content,

这事什么原因导致的呢,包好像都进行加载了

代码片段

目前就是这种效果,一直是204

您的vtpk数据能发我本地测试吗?可以发我邮箱:2434721350@qq.com
您好,我本地测试可以正常加载,主要使用了一个test.js,然后npm install @supermapgis/iclient-mapboxgl 安装了MapboxGL。我将我的vue+Leaflet打包发您

1、安装npm install @supermapgis/iclient-mapboxgl

2、引入test.js

3、修改vue.config.js

4、在index.html引入mapbox-gl-enhance

5、在MapboxGL.vue中修改程序
热门文章
关注我们
...