資訊專欄INFORMATION COLUMN
摘要：自定義瓦片定義一個瓦片地址官方文檔由此我們只需要重寫這個方法即可數據準備用爬蟲下載了一些高德地圖放大層數最小的圖片大小的簡單服務器配置，將這些圖片放到下使之能夠正常訪問代碼編寫常用參數配置用于調試的網格編號很重要使用說明可以用來檢查是否是
openlayers-自定義瓦片 定義一個瓦片地址
ol.source.TileImage.tileUrlFunction
官方文檔
由此我們只需要重寫這個ol.source.TileImage.tileUrlFunction方法即可
數據準備用爬蟲下載了一些高德地圖放大層數最小的圖片256*256大小的
簡單服務器配置，將這些圖片放到tomcat下使之能夠正常訪問
代碼編寫
常用參數配置
var proj_3857 = new ol.proj.get("EPSG:3857");
var proj_3857Extent = proj_3857.getExtent();
var mapWidth3857 = ol.extent.getWidth(proj_3857.getExtent());
var resolutions3857 = [156543.03392804097, 78271.51696402048, 39135.75848201024,
19567.87924100512, 9783.93962050256, 4891.96981025128, 2445.98490512564, 1222.99245256282,
611.49622628141, 305.748113140705, 152.8740565703525, 76.43702828517625, 38.21851414258813,
19.109257071294063, 9.554628535647032, 4.777314267823516, 2.388657133911758, 1.194328566955879,
0.5971642834779395];
用于調試的網格編號(很重要)
var tileGrid = new ol.tilegrid.TileGrid({
resolutions: resolutions3857,
tileSize: [256, 256],
extent: proj_3857Extent,
origin: ol.extent.getTopLeft(proj_3857Extent),
});
使用說明：
可以用來檢查是否是對應的圖片
瓦片圖層
var tilesource = new ol.source.TileImage({
tileUrlFunction: function (tileCoord) {
var z = tileCoord[0];
var x = tileCoord[1];
var y = Math.abs(tileCoord[2]);
return "http://localhost:9999/gaode_tiles_tms/" + z + "/" + x + "/" + y + ".png";
},
tileGrid: tileGrid,
projection: proj_3857,
});
完整demo
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/103063.html
摘要：比例尺分類數字式，用數字的比例式或分數式表示比例尺的大小。中比例尺介紹中默認地圖比例尺為直線式，如圖該比例尺存在精確測量無法讀取比例尺實際值的缺點。因此有必要將直線比例尺轉換成數字比例尺。 1.比例尺分類（1）數字式，用數字的比例式或分數式表示比例尺的大小。例如地圖上1厘米代表實地距離500千米，可寫成：1∶50 000 000或寫成：五千萬分之一。（2）線段式（也叫直線式），在地圖上...
摘要：注意在代碼中將其替換為自己剛剛申請的運行，顯示地圖修改保存之后點擊運行就可以得到一幅矢量地圖了，此過程可能會稍微有點長，要耐心多等一會兒。 VectorMap.js是一個開源地圖渲染JavaScript庫， 可以使用WebGL或者HTML5兩種方式進行交互式矢量地圖 （包括矢量瓦片地圖，一般性矢量數據地圖）和 柵格瓦片地圖的渲染。 WebGL渲染意味著高性能，大數據， HTML5渲染意...
摘要：代碼起始點坐標左上角終點坐標右下角根據地圖平臺使用轉換類這里是用百度的最大最小縮放等級循環產生瓦片圖目錄結構層級橫坐標范圍縱坐標范圍這個是你圖片要存放的位置先要產生操作完的流程后再執行這個后面有說這個的用處這個函數是獲取一個的對象數組 nodejs代碼 const request = require(request); const fs = require(fs); const bag...
閱讀 3262·2021-09-22 16:06
閱讀 3254·2021-09-02 15:40
閱讀 640·2019-08-30 15:54
閱讀 1044·2019-08-26 12:22
閱讀 1384·2019-08-26 12:17
閱讀 2750·2019-08-26 12:09
閱讀 510·2019-08-26 10:20
閱讀 794·2019-08-23 16:28
