OpenLayers gebruiken met RD New en PDOK

OpenLayers is een bibliotheek die in de browser kaarten tekent uit tegels, vectordata en markeringen. Het project beschrijft zichzelf zo:

OpenLayers is a high-performance, feature-packed library for creating interactive maps on the web.

Bron: README van het project op GitHub, gelezen op 11 oktober 2026. In de tabel staan de gegevens die u voor een keuze nodig hebt. Ze komen uit GitHub, npm en de API-documentatie van OpenLayers.

Deze pagina gaat over het werken met OpenLayers zelf. Of OpenLayers, Leaflet of MapLibre bij uw project past, staat in de gids Kaartbibliotheek kiezen.

U definieert de projectie met proj4 en maakt hem bekend bij OpenLayers. De documentatie van de module ol/proj/proj4 zegt over de functie register:

Make projections defined in proj4 (with proj4.defs()) available in OpenLayers.

Bron: API-documentatie van OpenLayers 10.11.0, gelezen op 11 oktober 2026. Daarna haalt u de projectie op met get('EPSG:28992') en geeft u hem een extent, zodat OpenLayers weet waar de kaart ophoudt.

De proj4-definitie is het onderdeel waar het misgaat. Het referentiestelsel van RD New is de Bessel-ellipsoïde, en voor de omrekening naar WGS84 hoort daar een +towgs84-reeks bij. Verkeerde parameters geven geen foutmelding, maar een kaart die ver van de werkelijkheid ligt.

De oorzaak van de tweede rij is een eenheid en een tekenconventie. In de EPSG-transformatie 4833 (Amersfoort to WGS 84 (4)) staan de rotaties in microradialen, volgens de methode coordinate frame rotation. proj4js vermenigvuldigt de rotaties in +towgs84 met een factor voor boogseconden. Reken 1,9342 microradiaal om naar boogseconden en draai het teken om, dan krijgt u precies −0,398957388243134, de waarde uit de vierde rij; voor de andere twee rotaties geldt hetzelfde. Die vierde definitie staat in het codevoorbeeld hieronder. Toets daarom elke definitie aan bekende punten voordat u er kaarten op bouwt. De RD naar WGS84-tool op deze site is daarvoor bruikbaar, net als de coördinaten die de PDOK Locatieserver teruggeeft.

U maakt een tegelraster dat precies overeenkomt met dat van PDOK en wijst een XYZ-bron naar de tegel-URL. PDOK publiceert de BRT-achtergrondkaart onder andere in het stelsel EPSG:28992. Het tegelraster staat in het GetCapabilities-document van de WMTS.

De resolutie van niveau 0 volgt uit de schaalnoemer maal 0,28 millimeter, de pixelgrootte die WMTS aanhoudt. Elk volgend niveau halveert die waarde. Hoe WMTS zich verhoudt tot WMS, staat op WMS en WMTS. Hoeveel verkeer u PDOK mag laten voeren, leest u bij PDOK fair use en caching.

Installeer ol en proj4 met npm en zet in de pagina een element met id map en een hoogte. Dit script toont de achtergrondkaart rond Amersfoort in RD New.

import 'ol/ol.css';
import Map from 'ol/Map.js';
import View from 'ol/View.js';
import TileLayer from 'ol/layer/Tile.js';
import XYZ from 'ol/source/XYZ.js';
import TileGrid from 'ol/tilegrid/TileGrid.js';
import { get as getProjection } from 'ol/proj.js';
import { register } from 'ol/proj/proj4.js';
import proj4 from 'proj4';

// EPSG:28992, "Amersfoort / RD New"
proj4.defs(
  'EPSG:28992',
  '+proj=sterea +lat_0=52.1561605555556 +lon_0=5.38763888888889 +k=0.9999079 ' +
    '+x_0=155000 +y_0=463000 +ellps=bessel ' +
    '+towgs84=565.4171,50.3319,465.5524,-0.398957388243134,0.343987817378283,-1.87740163998045,4.0725 +units=m +no_defs',
);
register(proj4);

const rd = getProjection('EPSG:28992');
rd.setExtent([-285401.92, 22598.08, 595401.92, 903401.92]);

// Tegelschema van de PDOK-WMTS in RD: 15 niveaus (00 tot en met 14), resolutie in m/pixel
const resolutions = Array.from({ length: 15 }, (_, z) => 3440.64 / 2 ** z);
const tileGrid = new TileGrid({
  origin: [-285401.92, 903401.92],
  resolutions,
  tileSize: 256,
});

const map = new Map({
  target: 'map',
  layers: [
    new TileLayer({
      source: new XYZ({
        projection: rd,
        tileGrid,
        url: 'https://service.pdok.nl/kadaster/brt-achtergrondkaart/wmts/v2_0/standaard/EPSG:28992/{z}/{x}/{y}.png',
        attributions: 'Kaartgegevens © Kadaster (CC BY 4.0)',
      }),
    }),
  ],
  view: new View({
    projection: rd,
    center: [155000, 463000], // de oorsprong van het RD-stelsel, bij Amersfoort
    zoom: 12,
  }),
});

Test op 11 oktober 2026: het script is gebundeld met esbuild en geladen in headless Chromium. De view had projectie EPSG:28992, het midden lag op (155000, 463000) en de tegelverzoeken aan PDOK gaven status 200. Het resultaat was een leesbare kaart van het centrum van Amersfoort.

Voor de achtergrond is geen sleutel of aanmelding nodig. Zet de bronvermelding wel zichtbaar op de kaart, want de licentie vraagt erom. Een eigen laag in RD voegt u toe zoals elke andere laag, met coördinaten in meters.

U voegt een tweede TileLayer toe met een TileWMS-bron die dezelfde RD-projectie gebruikt. OpenLayers vraagt de WMS dan in EPSG:28992 op, zodat de laag zonder herprojectie op de achtergrond past. Als voorbeeld dient de kadastrale kaart van het Kadaster. Volgens het GetCapabilities-document (gelezen op 11 oktober 2026) ondersteunt de laag Kadastralekaart onder meer EPSG:28992, EPSG:3857 en EPSG:4326, en staat als gebruiksvoorwaarde de CC0-verklaring van Creative Commons.

import TileWMS from 'ol/source/TileWMS.js';

// Na de achtergrondlaag uit het vorige voorbeeld:
map.addLayer(
  new TileLayer({
    source: new TileWMS({
      url: 'https://service.pdok.nl/kadaster/kadastralekaart/wms/v5_0',
      params: { LAYERS: 'Kadastralekaart', TILED: true },
      projection: rd,
      attributions: 'Kadastrale kaart © Kadaster (CC0)',
    }),
  }),
);

Test op 11 oktober 2026: dezelfde bundel als hierboven, met deze laag erbij en de view op zoomniveau 13 (0,42 meter per pixel). Alle 32 verzoeken aan PDOK, tegels en WMS-beelden samen, gaven status 200 en de perceelgrenzen met perceelnummers vielen over de straten van de achtergrondkaart. Over de inhoud van die dataset leest u meer bij BRK kadastrale kaart.

Wilt u objecten opvragen in plaats van een plaatje, gebruik dan een WFS- of OGC API Features-bron met een vectorlaag. Het verschil tussen die protocollen staat in WFS en OGC API Features.

Vijf punten verdienen aandacht. De eerste is hierboven gemeten, de andere volgen uit de OpenLayers-API en de WMTS-beschrijving van PDOK.

• De +towgs84-parameters in de proj4-definitie, zoals hierboven gemeten. Toets met minstens twee bekende punten.
• De volgorde van coördinaten. In RD is dat oost, noord in meters, in WGS84 lengte, breedte. Functies als fromLonLat rekenen naar Web Mercator, niet naar RD. Gebruik transform met expliciete codes.
• Een tegelraster dat niet exact klopt. De linkerbovenhoek en de resoluties moeten overeenkomen met de WMTS, anders ligt de achtergrond verschoven of onscherp.
• Het aantal niveaus. In RD stopt het gepubliceerde raster bij niveau 14, met 0,21 meter per pixel. Stel maxZoom daarop in als u het niet wilt laten oprekken.
• Vergeten CSS. Zonder import 'ol/ol.css' staan de zoomknoppen en de bronvermelding als ongestijlde lijst op de pagina.

Wie de kaart ook in WGS84 nodig heeft, rekent coördinaten om met dezelfde definitie. Dat voorkomt dat twee onderdelen elk een eigen versie van RD gebruiken.

OpenLayers is zwaarder dan wat u voor een kaartje met één markering nodig hebt, en dat is een reden om iets lichters te nemen. Bij een kleine kaart in Web Mercator voegt de bibliotheek meer toe dan u gebruikt.

Ligt de nadruk op vectortegels met een kant-en-klare stijl in Web Mercator, dan is MapLibre vaak de kortere route. De volledige afweging met versies, licenties en gemeten bundelgroottes staat in Kaartbibliotheek kiezen en wordt hier niet herhaald. Voor een gemeente die toegankelijkheid wil aantonen, is de gids over toegankelijke kaarten relevanter dan de keuze van de bibliotheek.

Voor OpenLayers pleit dat het RD New als gewone projectie behandelt en dat u WMS, WMTS en GeoJSON in één kaart combineert. Een volledige viewer heeft daarnaast zoeken, lagenbeheer en beheer nodig, en dat is meer werk dan de kaartbibliotheek zelf. Wat TechinFlow daarover levert, staat op GIS-viewer voor gemeenten.

Tekin Uslu zette in februari 2020 twee OpenLayers-viewers publiek op GitHub: Atlas-Basic en Atlas-Starter. De repositories hebben geen licentiebestand, dus hergebruik van de code vraagt toestemming. Volgens GitHub dateren de laatste commits van februari 2020 (Atlas-Basic) en april 2020 (Atlas-Starter), dus neem ze als voorbeeld en niet als actueel product. Meer over hem staat op Tekin Uslu.