M
MapLibre COG Protocol
Cloud Optimized GeoTIFFs as map layers
Maintained by Geomatico
A custom protocol that reads Cloud Optimized GeoTIFFs straight from static hosting into MapLibre GL JS: imagery as raster layers, single-band data with color ramps, and elevation models as hillshade or 3D terrain.
Live demo
MapLibre COG Protocol running on MapLibre GL JS in your browser
Loading the map…
Demo code
import { cogProtocol } from "@geomatico/maplibre-cog-protocol";
import type { PluginDemo } from "../types";
export default {
center: [1.83369, 41.5937], // Martorell, Catalonia
zoom: 15,
run({ map, maplibregl }) {
// Read a Cloud Optimized GeoTIFF straight from static hosting, tile by tile.
maplibregl.addProtocol("cog", cogProtocol);
// An aerial image from the plugin's sample data (about 50 MB, fetched with range requests).
map.addSource("aerial", {
type: "raster",
url: "cog://https://labs.geomatico.es/maplibre-cog-protocol/data/image.tif",
tileSize: 256,
});
map.addLayer({ id: "aerial", type: "raster", source: "aerial" }, "waterway_line_label");
},
} satisfies PluginDemo;
