diff --git a/js/sitnlayers.js b/js/sitnlayers.js index 1e4f8a1..1de5497 100644 --- a/js/sitnlayers.js +++ b/js/sitnlayers.js @@ -13,18 +13,17 @@ (function (window) { function sitnLayers() { const sitnLayers = {}; - const _extent = [2420000, 1030000, 2900000, 1350000]; + const _extent = [2420000, 1030000, 2900000, 1360000]; const _crs = 'EPSG:2056'; - const _WMTSurl = 'https://sitn.ne.ch/services/wmts?SERVICE=WMTS&REQUEST=GetCapabilities'; const _WMSurl = 'https://sitn.ne.ch/mapserv_proxy?ogcserver=source+for+image%2Fpng'; const _drawSource = new ol.source.Vector(); const _markerColor = '#8959A8'; const _markerSource = new ol.source.Vector(); const _sitnBaseLayers = { - plan_ville: 'Plan de ville', - plan_cadastral: 'Plan cadastral', - ortho: 'Images aériennes', - topo: 'Plan topographique', + plan_ville: { nameFr: 'Plan de ville', format: 'png' }, + plan_cadastral: { nameFr: 'Plan cadastral', format: 'png' }, + ortho: { nameFr: 'Images aériennes', format: 'jpeg' }, + topo: { nameFr: 'Plan topographique', format: 'png' }, }; // A dictionnary containing named layers in the form of { layer_name: ol.layer.Image(), } const _sitnWMSLayers = {}; @@ -60,6 +59,20 @@ extent: _extent, }); + const _resolutions = [ + 250, 100, 50, 20, 10, 5, 2.5, 2, 1.5, 1, 0.5, 0.25, 0.125, 0.0625, + 0.03125, 0.015625, 0.0078125]; + const _matrixIds = []; + for (let i = 0; i < _resolutions.length; i += 1) { + _matrixIds.push(i); + } + + const _tileGrid = new ol.tilegrid.WMTS({ + origin: [_extent[0], _extent[3]], + resolutions: _resolutions, + matrixIds: _matrixIds + }); + sitnLayers._createMarkerStyle = function (color) { return new ol.style.Icon({ anchor: [0.5, 1], @@ -68,26 +81,33 @@ src: _markerImage, }); }; - // TODO: get out source from here when base layer selection will be implemented + sitnLayers.setSource = function (layerName) { - fetch(_WMTSurl).then((response) => response.text()).then((getCap) => { - const _parser = new ol.format.WMTSCapabilities(); - const _result = _parser.read(getCap); - sitnLayers.WMTSOptions = ol.source.WMTS.optionsFromCapabilities( - _result, { - layer: layerName, - matrixSet: _crs, - }, - ); - const source = new ol.source.WMTS(sitnLayers.WMTSOptions); - sitnLayers.sitnCurrentBaseLayer.setSource(source); - }); + const format = _sitnBaseLayers[layerName]['format']; + const source = new ol.source.WMTS({ + layer: layerName, + attributions: 'Informations dépourvues de foi publique, ' + + '' + + '© SITN | ' + + '' + + 'swisstopo DV 571.4 | ' + + 'OpenStreetMap | ' + + 'Maps Icons Collection', + projection: _projection, + url: `https://sitn.ne.ch/mapproxy95/wmts/1.0.0/{layer}/{style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.${format}`, + matrixSet: 'EPSG2056', + style: 'default', + tileGrid: _tileGrid, + requestEncoding: 'REST' + }) + sitnLayers.sitnCurrentBaseLayer.setSource(source); }; sitnLayers.view = new ol.View({ projection: _projection, center: ol.proj.fromLonLat([6.80, 47.05], _projection), - zoom: 4, + resolutions: _resolutions, + constrainResolution: true }); /** @@ -174,7 +194,7 @@ ], view: sitnLayers.view, }); - sitnLayers.view.setZoom(options.minZoom || 4); + sitnLayers.view.setZoom(options.minZoom || 1); sitnLayers.view.setMinZoom(_minZoom); sitnLayers.view.setMaxZoom(_maxZoom); @@ -185,7 +205,7 @@ if (_baselayers && _selectTarget) { const selectElement = document.getElementById(_selectTarget); Object.values(_baselayers).forEach((baselayer) => { - selectElement.append(new Option(_sitnBaseLayers[baselayer], baselayer)); + selectElement.append(new Option(_sitnBaseLayers[baselayer]['nameFr'], baselayer)); }); selectElement.onchange = () => {