Skip to content

Instantly share code, notes, and snippets.

@ndkv
Last active July 7, 2023 12:36
Show Gist options
  • Save ndkv/a9f903c1579ff7609638 to your computer and use it in GitHub Desktop.
Save ndkv/a9f903c1579ff7609638 to your computer and use it in GitHub Desktop.
PDOK docs Quickstart Leaflet
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<link rel="stylesheet" href="https://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" />
<script src="https://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
<style>
#map {
position: absolute;
top: 0px;
bottom: 0px;
width: 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script type="text/javascript">
var map = L.map('map');
map.setView([53.232, 6.569], 16);
// load OpenStreetMap basemap
var basemap = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png');
basemap.addTo(map);
var url = 'https://geodata.nationaalgeoregister.nl/bag/wfs?';
var params = 'request=GetFeature&';
params += 'service=WFS&';
params += 'typeName=bag:pand&';
params += 'count=100&';
params += 'outputFormat=json&';
params += 'srsName=EPSG:4326&';
params += 'bbox=232425,583269,234365,584240';
$.getJSON(url + params, function(data) {
$.each(data.features, function(index, geometry) {
L.geoJson(geometry).addTo(map);
});
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment