Openlayers中加载WMTS地图服务,自定义级别、分辨率 原创
需要以下几个参数
- origin(原点)
- resolutions(分辨率数组)
- matrixIds(分辨率对应的级别)
- projection(坐标系) 以arcgis server 发布的服务为例,如图
var projection = ol.proj.get("EPSG:4326"); var resolutions = [0.00118973050291514, 5.9486525145757E-4, 2.97432625728785E-4, 1.5228550437313792E-4,7.614275218656896E-5, 3.807137609328448E-5, 1.903568804664224E-5, 9.51784402332112E-6, 4.75892201166056E-6]; var matrixIds = [0, 1, 2, 3, 4, 5, 6, 7, 8]; var origin=[-400, 400];
openlayers3中可以通过ol.source.WMTS、ol.source.XYZ等方式加载,无论哪一种,都需要根据上述几个参数进行配置,
var tileGrid = new ol.tilegrid.TileGrid({ origin: origin, //原点(左上角) resolutions: resolutions, //分辨率数组 matrixIds: matrixIds //矩阵标识列表,与地图级数保持一致 }),
然后根据不同的数据源加载方式,设置参数(url、tileGrid、crossOrigin等)
//通过WMTS加载 var wmtsLayer = new ol.layer.Tile({ opacity: 0.7, //图层透明度 source: new ol.source.WMTS({ url: 'http://serverIP:6080/arcgis/rest/services/XXX/MapServer/WMTS/', //WMTS服务基地址 matrixSet: 'EPSG:4326', //投影坐标系设置矩阵 format: 'image/png', //图片格式 projection: projection, //数据的投影坐标系 //瓦片网格对象 tileGrid: tileGrid, style: 'default', wrapX: true }) }); map.addLayer(wmtsLayer); //通过XYZ加载 var xyzLayer = new ol.layer.Tile({ source: new ol.source.XYZ({ crossOrigin: "anonymous", projection: "EPSG:4326", tileGrid: tileGrid, tileUrlFunction: function (tileCoord) { var z = tileCoord[0]; var x = tileCoord[1]; var y = -tileCoord[2]-1; return "http://serverIP:6080/arcgis/rest/services/XXX/MapServer/tile/" + z + "/" + y + "/" + x; }, wrapX: true, }) }); map.addLayer(xyzLayer);
结论:地图采用自定义分辨率时,需要设置图层的tilegird参数