openlayers加载矢量切片
openlayers加载矢量切片,EPSG:4326坐标系和EPSG:900913坐标系有些不同,主要是分辨率(Resolutions)计算的差别。
以下加载代码基于V5.3.3版本的openlayers版本。
EPSG:900913坐标系加载代码如下:
function loadData(){ var source = new VectorTileSource({ format: new MVT(), tileGrid: createXYZ({ extent: getProjection('EPSG:900913').getExtent(), maxZoom: 22 }), tileUrlFunction:function(tileCoord){ return '/geoserver/gwc/service/tms/1.0.0/HNQX:wisdom_mroad@EPSG:900913@pbf/' + (tileCoord[0]) + '/' + tileCoord[1] + '/' + (Math.pow(2, tileCoord[0]) + tileCoord[2]) + '.pbf' } }); return source; }
EPSG:4326坐标系加载代码如下:
1 function setTrackData(sourceName){ 2 var source = new VectorTileSource({ 3 format: new MVT(), 4 tileGrid: createXYZ({ 5 extent: getProjection('EPSG:4326').getExtent(), 6 maxZoom: 22 7 }), 8 tileUrlFunction:function(tileCoord){ 9 return '/geoserver/gwc/service/tms/1.0.0/HNQX:' + sourceName + '@EPSG:4326@pbf/' + (tileCoord[0] - 1) 10 + '/' + tileCoord[1] + '/' + (Math.pow(2, tileCoord[0] - 1) + tileCoord[2]) + '.pbf' 11 } 12 }); 13 return source; 14 }
Tips:截至目前,发现最新6.X版本的openlayers加载矢量切片会出错。