WMTS Layer from Capabilities
import 'ol/ol.css'; import Map from 'ol/Map'; import OSM from 'ol/source/OSM'; import TileLayer from 'ol/layer/Tile'; import View from 'ol/View'; import WMTS, {optionsFromCapabilities} from 'ol/source/WMTS'; import WMTSCapabilities from 'ol/format/WMTSCapabilities'; var parser = new WMTSCapabilities(); var map; fetch('data/WMTSCapabilities.xml') .then(function (response) { return response.text(); }) .then(function (text) { var result = parser.read(text); var options = optionsFromCapabilities(result, { layer: 'layer-7328', matrixSet: 'EPSG:3857', }); map = new Map({ layers: [ new TileLayer({ source: new OSM(), opacity: 0.7, }), new TileLayer({ opacity: 1, source: new WMTS(options), }) ], target: 'map', view: new View({ center: [19412406.33, -5050500.21], zoom: 5, }), }); });
https://openlayers.org/en/latest/examples/wmts-layer-from-capabilities.html