OGC map tile source

examples/ogc-map-tiles-geographic.html

@@ -0,0 +1,9 @@
+---
+layout: example.html
+title: OGC Map Tiles (Geographic)
+shortdesc: Rendering map tiles from an OGC API – Tiles service.
+docs: >
+  The OGC API – Tiles specification describes how a service can provide map tiles.
+tags: "ogc"
+---
+<div id="map" class="map"></div>

examples/ogc-map-tiles-geographic.js

@@ -0,0 +1,20 @@
+import Map from '../src/ol/Map.js';
+import OGCMapTile from '../src/ol/source/OGCMapTile.js';
+import TileLayer from '../src/ol/layer/Tile.js';
+import View from '../src/ol/View.js';
+
+const map = new Map({
+  target: 'map',
+  layers: [
+    new TileLayer({
+      source: new OGCMapTile({
+        url: 'https://maps.ecere.com/ogcapi/collections/blueMarble/map/tiles/WorldCRS84Quad',
+      }),
+    }),
+  ],
+  view: new View({
+    projection: 'EPSG:4326',
+    center: [0, 0],
+    zoom: 1,
+  }),
+});

examples/ogc-map-tiles.html

@@ -0,0 +1,9 @@
+---
+layout: example.html
+title: OGC Map Tiles
+shortdesc: Rendering map tiles from an OGC API – Tiles service.
+docs: >
+  The OGC API – Tiles specification describes how a service can provide map tiles.
+tags: "ogc"
+---
+<div id="map" class="map"></div>

examples/ogc-map-tiles.js

@@ -0,0 +1,19 @@
+import Map from '../src/ol/Map.js';
+import OGCMapTile from '../src/ol/source/OGCMapTile.js';
+import TileLayer from '../src/ol/layer/Tile.js';
+import View from '../src/ol/View.js';
+
+const map = new Map({
+  target: 'map',
+  layers: [
+    new TileLayer({
+      source: new OGCMapTile({
+        url: 'https://maps.ecere.com/ogcapi/collections/blueMarble/map/tiles/WebMercatorQuad',
+      }),
+    }),
+  ],
+  view: new View({
+    center: [0, 0],
+    zoom: 1,
+  }),
+});