Repro: WMTS beyond native zoom (400s)
HTML
<script
async
src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&v=weekly&callback=initMap"
></script>
<div id="map"></div>
CSS
html,
body,
#map {
height: 100%;
margin: 0;
padding: 0;
}
JavaScript
const MAX_NATIVE_ZOOM = 19;
function wmtsUrl(z, x, y) {
return `https://data.geopf.fr/wmts?layer=HR.ORTHOIMAGERY.ORTHOPHOTOS&style=normal&tilematrixset=PM&Service=WMTS&Request=GetTile&Version=1.0.0&Format=image%2Fjpeg&TileMatrix=${z}&TileCol=${x}&TileRow=${y}`;
}
async function initMap() {
const { Map, ImageMapType } = await google.maps.importLibrary("maps");
const { Size } = await google.maps.importLibrary("core");
const ortho = new ImageMapType({
tileSize: new Size(256, 256),
minZoom: 0,
maxZoom: 22,
name: "Orthophotos",
getTileUrl: (coord, zoom) => {
const url = wmtsUrl(zoom, coord.x, coord.y);
console.log(`[WMTS] z=${zoom} x=${coord.x} y=${coord.y} -> ${url}`);
return url; // requests >19 will 400 (as desired for the repro)
},
});
const map = new Map(document.getElementById("map"), {
center: { lat: 48.8566, lng: 2.3522 },
zoom: 18,
mapTypeControlOptions: { mapTypeIds: ["ortho"] },
mapTypeId: "ortho",
});
map.mapTypes.set("ortho", ortho);
}