Question

使用产品：iserver 8c, iclient9 for leaflet

我现在有一个iserver 8c发布的地图服务，但是用iclient9 for leaflet请求时返回的地图是空白的，因此显示不出地图

我用的是平面坐标系，但是已经设置好bounds和origin了，但是还是不行。是不是leaflet不支持iserver8的地图？

Answer 1

您好，iServer8C的rest地图服务是可以加载的没有问题，您可以参照范例http://iclient.supermap.io/examples/leaflet/editor.html#01_tiledMapLayerNonEarth来实现平面坐标系的地图的加载，如果还是不行的话，建议您将您的代码以及您服务的参数回复至下方，看看哪里出了问题。

Comments

import '@supermap/iclient-leaflet'

export default {
  name: 'HelloWorld',
  mounted () {
    let url = 'http://47.104.22.0:8090/iserver/services/map-YuJiaWuGIS/rest/maps/%E6%80%BB%E5%9B%BE'
    let map = this.initMap()
    L.supermap.tiledMapLayer(url, {noWrap: true}).addTo(map)
  },
  data () {
    return {
      msg: 'Welcome to Your Vue.js App'
    }
  },
  methods: {
    initMap () {
      return L.map('map', {
        crs: L.CRS.NonEarthCRS({
            bounds: L.bounds([4400685.34, 470369.84], [4386277.24, 480448.49]),
            origin: L.point(4400685.34, 480448.49)
        }),
        center: [474883.82, 4394106.75],
        maxZoom: 10,
        zoom: 1
      })
    }
  }
}

下面的地图的信息

下面是传的参数

用范例里的url是可以显示地图的，所以我觉得还是发布的地图的问题

---

1.您的url中有中文的话，再复制粘贴的时候最好能改回到原来的中文字符

2.bounds的范围的顺序应该是左下右上的顺序，您这里范围写的不对，origin也应该写左上才可以

3.中心点位置center应该是[ 4394106.75,474883.82],这里中心点位置应该反写才可以

---

最后运行结果您可以参考下

---

okay，明白了，是bounds和中心点的顺序问题，改了就显示出来了，一直以为是上左下右的顺序，多谢啦！！

Answer 2

设置   CRS  然后要注意的是  Map.center 是 latlng 类型 Y在前X在后，还有 vue 要考虑组件生命周期的问题，要等  div 挂在成功再初始化 地图

var crs =L.Proj.CRS("EPSG:4326",{
         origin: [-180,90],
         scaleDenominators: [2000,1000,500,200,100,50,20,10],
   });
   var map=L.map('map', {
      crs: crs
     ...
   })