美文网首页Open LayersGIS相关ol
用OpenLayers 3加载瓦片地图

用OpenLayers 3加载瓦片地图

作者: 猿基地 | 来源:发表于2015-07-28 14:53 被阅读10612次

    在OpenLayers 3中,可以使用下面的代码创建一个加载瓦片地图的layer,然后把该layer添加到map里面就可以了,新建加载瓦片地图的layer代码示例:

    var mapLayer = new ol.layer.Tile({
        source: new ol.source.XYZ({
            url: 'http://4.maps.nlp.nokia.com.cn/maptile/2.1/maptile/5b33fc2110/normal.day/{z}/{x}/{y}/256/png8?lg=CHI&app_id=90oGXsXHT8IRMSt5D79X&token=JY0BReev8ax1gIrHZZoqIg&xnlp=CL_JSMv2.5.3.2'
        })
    });
    

    代码里面url用的是nokia的地图,你换成google的就行, 注意url里面的{x},{y},{z}是对应的x,y,z的占位符,在运行时,ol3会自动被替换成对应的实际的x,y,z值,我们需要注意的就是他们的位置必须放正确就okay了。

    对于离线瓦片,把url的值换成离线瓦片的路径即可。由于问如何加载离线瓦片地图的人比较多, 我写了一个demo,参见https://github.com/anzhihun/OpenLayersStudy 里面的loadOfflineMap.html

    相关文章

      网友评论

      • 逍遥散人一生逍遥:在加载离线地图时,页面没有显示,而且会出现一大堆图片找不到的问题,页面应该显示一部分我本地的瓦片地图啊
      • 灬柳絮飞扬灬:楼主,怎么所有QQ群 都禁止加入了啊
        猿基地: @5dc009d25044 加GIS伙伴群吧
      • gis之家:你demo的离线瓦片数据在哪下载的呢,用哪个电子地图下载器呢
        gis之家:@猿基地 看了你推荐的网站,写的真心不错
        gis之家:@猿基地 你好,再请问一下,你的demo下载瓦片坐标系是谷歌地图的哈,我用太乐地图下载器下载百度地图的TMS格式瓦片,openlayer3读取XYZ形式就有偏差,只有谷歌地图瓦片是没问题的
        猿基地:@gis之家 自己写的工具,要是你用的其他电子地图下载器下载的, 可以看一下我的教程里面的万能瓦片地图加载秘籍(http://weilin.me/ol3-primer/ch05/05-03.html),搞清楚原理了,基本都可以自己搞定加载各种下载器下载的地图。 如果还是有疑问, 欢迎加入QQ群 OpenLayers官方旗舰群[2] 274788071 来咨询

      本文标题:用OpenLayers 3加载瓦片地图

      本文链接:https://www.haomeiwen.com/subject/lmymqttx.html