用OpenLayers 3加載瓦片地圖

在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

最后編輯于 ：
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明：文章內容（如有圖片或視頻亦包括在內）由作者上傳并發布，文章內容僅代表作者本人觀點，簡書系信息發布平臺，僅提供信息存儲服務。

推薦閱讀更多精彩內容