CINXE.COM

<!DOCTYPE html><html lang="nl-NL"><head><script async src="https://www.googletagmanager.com/gtag/js?id=G-1PZYVW4HT3"></script><script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-1PZYVW4HT3', {site: 'acnl', category: 'regionaal', subcategory: 'kaarten'});</script><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><meta name ="robots" content="max-image-preview:large"><link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous"> <link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css"><link rel="stylesheet" href="https://unpkg.com/leaflet-control-geocoder/dist/Control.Geocoder.css"><link rel="stylesheet" href="/css/openinfo_maps.css"><link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.4.1/dist/MarkerCluster.css"><link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.4.1/dist/MarkerCluster.Default.css"><link rel="stylesheet" type="text/css" href="/css/openinfo.css"><link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"><link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"><link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"><link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5"><meta name="msapplication-TileColor" content="#da532c"><meta name="theme-color" content="#ffffff"><title>Kaart met provincies, gemeenten, woonplaatsen, wijken, buurten en postcodes | AlleCijfers.nl</title><script type="application/ld+json"> { "@context": "https://schema.org", "@type": "Organization", "url": "https://allecijfers.nl", "logo": "https://allecijfers.nl/images/start/AlleCijfersLogo.svg" }</script><meta name="description" content="Gebruik de interactieve kaart van Nederland en bekijk de geometrie van de provincies, gemeenten, woonplaatsen, wijken, buurten en postcodes. Zoek op naam van het gebied, postcode of straatnaam en klik door naar de pagina鈥檚 met meer dan 250 statistieken per gebied in duidelijke cijfers en grafieken!"><meta name="keywords" content="open-data, openinfo, informatie, gegevens, data, cijfers, statistiek, grafieken, nieuws, analyses, ranglijsten, postcodegebied, adressen, inwoners, woningen, demografie, straat, weg, openbareruimte, Nederland"><base href="https://allecijfers.nl/"><meta property="og:title" content="Kaart met provincies, gemeenten, woonplaatsen, wijken, buurten en postcodes | AlleCijfers.nl"><meta property="og:image" content="https://allecijfers.nl/images/start/AlleCijfers-heel-veel-informatie-in-cijfers-en-grafieken.jpg"><meta property="og:description" content="Gebruik de interactieve kaart van Nederland en bekijk de geometrie van de provincies, gemeenten, woonplaatsen, wijken, buurten en postcodes. Zoek op naam van het gebied, postcode of straatnaam en klik door naar de pagina鈥檚 met meer dan 250 statistieken per gebied in duidelijke cijfers en grafieken!"><meta property="og:url" content="https://allecijfers.nl/kaart"><meta property="og:type" content="article"><meta property="og:site_name" content="AlleCijfers.nl"><meta property="fb:app_id" content="1679841595389333"><meta name="twitter:card" content="summary"><meta name="twitter:site" content="@AlleCijfers"><meta name="twitter:creator" content="@AlleCijfers"><meta property="article:published_time" content="2024-11-15T18:00:00+02:00"><meta property="article:modified_time" content="2024-12-16T17:11:37+2:00"></head><nav class="navbar navbar-expand-lg navbar-light navbar-custom" id="top"><div class="container-xxl justify-content-center border-bottom"><a class="navbar-brand" href="https://allecijfers.nl/" target="_blank"> <img src="/images/start/AlleCijfersLogoTekst.svg" height="36" class="d-inline-block align-top" alt="AlleCijfers logo"></a><button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button><div class="collapse navbar-collapse" id="navbarNavDropdown"><div class="navbar-nav ms-auto"><div class="nav-divider d-lg-none"></div><div class="nav-item"> <a class="nav-link mx-2 rounded" href="/zoeken/" target="_blank" title="Gebruik de zoekfunctie of bekijk de inhoudsopgave van AlleCijfers.nl."><img src="/images/theme/zoek.svg" height="22" class="d-inline-block pb-1" alt="Zoekicoon: een vergrootglas om naar de zoekpagina door te klikken."> Zoek</a></div><div class="nav-divider d-lg-none"></div><div class="nav-item dropdown"> <a class="nav-link dropdown-toggle mx-2 rounded" href="#" id="navbarDropdownMenuKaart" role="button" data-bs-toggle="dropdown" aria-expanded="false" title="Bekijk de interactieve kaarten."><img src="/images/theme/map.svg" height="22" class="d-inline-block pb-1" alt="Locatie-icoon: een puntvormige druppel die een kaartlocatie aangeeft."> Kaart</a> <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuKaart"> <a class="dropdown-item" href="/kaart/" title="Zoek provincies, gemeenten, wijken en buurten via de kaart." target="_blank">Kaart gebieden</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/onderwijskaart/" title="Bekijk de interactieve kaart met onderwijslocaties." target="_blank">Onderwijskaart</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/postcodekaart/" title="Bekijk postcodegebieden op de kaart." target="_blank">Postcodekaart</a> </div></div><div class="nav-divider d-lg-none"></div><div class="nav-item dropdown"> <a class="nav-link dropdown-toggle mx-2 rounded" href="#" id="navbarDropdownMenuOverzichten" role="button" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false"> <img src="/images/theme/cijfers.svg" height="22" class="d-inline-block pb-1" alt="Afbeelding van een klembord met een staafgrafiek als icoontje bij het menu-item waarmee de pagina's met statistieken getoond kunnen worden."> Cijfers</a> <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuOverzichten"> <a class="dropdown-item" href="/analyses/" target="_blank">Analyses</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/autodata/" target="_blank">Auto's</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/definities/" target="_blank">Bronnen, definities, uitleg</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/energie/" target="_blank">Energie</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/gezondheid/" target="_blank">Gezondheid</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/internationaal/" target="_blank">Landen, migratie</a> <div class="dropdown-divider"></div> <div class="dropdown dropend"> <a class="dropdown-item" href="#" id="dropdownSubMenuLinkRegionaal" data-bs-toggle="dropdown" aria-expanded="false">Nederland regionaal »</a> <div class="dropdown-menu" aria-labelledby="dropdownSubMenuLinkRegionaal"> <a class="dropdown-item" href="/nederland/" target="_blank">Nederland</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/provincies/" target="_blank">Provincies</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/gebieden/" target="_blank">Gemeenten Wijken Buurten</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/woonplaatsen/" target="_blank">Woonplaatsen</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/postcode/" target="_blank">Postcodes</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/ranglijsten/" target="_blank">Ranglijsten</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/adressen/" target="_blank">Adressen</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/regionaal/" target="_blank">Meer regionaal</a> </div> </div> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/nieuws/" target="_blank">Nieuws</a> <div class="dropdown-divider"></div> <div class="dropdown dropend"> <a class="dropdown-item" href="#" id="dropdownSubMenuLinkOnderwijs" data-bs-toggle="dropdown" aria-expanded="false">Onderwijs »</a> <div class="dropdown-menu" aria-labelledby="dropdownSubMenuLinkOnderwijs"> <a class="dropdown-item" href="/kinderopvang/" target="_blank">Kinderopvang</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/basisscholen-overzicht/" target="_blank">Basisonderwijs</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/middelbare-scholen-overzicht/" target="_blank">Middelbare scholen</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/mbo/" target="_blank">Middelbaar beroepsonderwijs</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/hbo/" target="_blank">Hoger beroepsonderwijs</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/universiteiten/" target="_blank">Universiteiten</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/onderwijs-besturen/" target="_blank">Schoolbesturen</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/onderwijs/" target="_blank">Meer onderwijs</a> </div> </div> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/verkiezingen/" target="_blank">Verkiezingen en politiek</a> </div></div><div class="nav-divider d-lg-none"></div><div class="nav-item dropdown"> <a class="nav-link dropdown-toggle mx-2 rounded" href="#" id="navbarDropdownMenuMeer" role="button" data-bs-toggle="dropdown" aria-expanded="false"><img src="/images/theme/meer.svg" height="22" class="d-inline-block pb-1" alt="Icoontje van een tandwiel met een plusteken erin, als illustratie bij het menu-item meer."> Meer</a> <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuMeer"> <a class="dropdown-item" href="/adverteren/" title="Adverteer met een groot bereik voor een kleine prijs" target="_blank">Adverteren</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/afbeelding/" title="Verzameling foto's van cijfers" target="_blank">Afbeeldingen van cijfers</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/zoeken/#alle-onderwerpen" title="Overzicht van alle onderwerpen" target="_blank">Alle onderwerpen</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/bedankt/" title="Bedankt voor je gebruik van AlleCijfers.nl!" target="_blank">Bedankt!</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/contact/" title="Contactgegevens" target="_blank">Contact</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/cookies/" title="Gebruik van cookies door AlleCijfers" target="_blank">Cookie gebruik</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/gemeentelijke-herindelingen/" target="_blank">Gemeentelijke herindelingen</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/maatwerk/" title="Service voor het verzamelen en verwerken van data tot informatie" target="_blank">Maatwerk</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="http://eepurl.com/glbecz" title="Schrijf je in en ontvang een bericht als de informatie is bijgewerkt." target="_blank">Nieuwsbrief</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/over-ons/" title="Achtergrond over AlleCijfers.nl" target="_blank">Over AlleCijfers.nl</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="/scholen/" target="_blank">Schoolnamen</a> <div class="dropdown-divider"></div> <a class="dropdown-item" href="https://youtube.com/@AlleCijfers" target="_blank">YouTube kanaal</a> </div></div><div class="nav-divider d-lg-none"></div><div class="nav-item px-1 me-0 oranje rounded"><a class="nav-link" href="https://openinfo.nl/downloads/uitgebreide-gemeente-informatie-gratis-voorbeeld/" target="_blank" title="Download een gratis voorbeeld van de regionale data."><img src="/images/theme/download.svg" height="22" class="d-inline-block pb-1" alt="Afbeelding van een tabel om aan te geven dat de datasets gedownload kunnen worden."> Download</a></div></div></div></div></nav><div><div class="container-xxl"> <div class="row py-1 d-flex align-items-center"> <div class="col-auto"> <div class="dropdown"> <button class="btn btn-light dropdown-toggle" type="button" id="zoomDropdown" data-bs-toggle="dropdown" aria-expanded="false"></button> <ul class="dropdown-menu" aria-labelledby="zoomDropdown"> <li><a class="dropdown-item" href="#" data-zoom="7">Provincies</a></li> <li><a class="dropdown-item" href="#" data-zoom="11">Gemeenten</a></li> <li><a class="dropdown-item" href="#" data-zoom="12">Woonplaatsen</a></li> <li><a class="dropdown-item" href="#" data-zoom="13">Wijken</a></li> <li><a class="dropdown-item" href="#" data-zoom="14">Buurten</a></li> <li><a class="dropdown-item" href="#" data-zoom="17">Postcodes</a></li> </ul> </div> </div> <div class="col mt-1"> <input type="text" id="search-box" class="form-control" placeholder="Plaats, postcode of straatnaam..."> <div id="search-results" class="list-group mt-2"></div> </div> </div> </div> <div id="loading-spinner"></div> <div id="map"></div> <button onclick="topFunction()" id="buttontop_map" title="Top">↑</button></div><script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script><script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js" integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""></script><script src="https://unpkg.com/leaflet-control-geocoder@2.4.0/dist/Control.Geocoder.js"></script><script src="/js/oi_leaflet.js"></script><script>function topFunction() {document.body.scrollTop = 0;document.documentElement.scrollTop = 0;}const zoomLevels = {4: 'Provincies',5: 'Provincies',6: 'Provincies',7: 'Provincies',8: 'Provincies',9: 'Provincies',10: 'Gemeenten',11: 'Gemeenten',12: 'Woonplaatsen',13: 'Wijken',14: 'Buurten',15: 'Buurten',16: 'Buurten',17: 'Postcodes',18: 'Postcodes'};const colors = {'Landen': '#dfc27d','Provincies': '#5ab4ac','Gemeenten': '#ffd966','Woonplaatsen': '#fccde5','Wijken': '#b2abd2','Buurten': '#67a9cf','Postcodes': '#d8b365','Gekozen_gebied': '#fbb151'};function getUrlParams() {const params = new URLSearchParams(window.location.search);return {lon: parseFloat(params.get('lon')) || 5.1214,lat: parseFloat(params.get('lat')) || 52.0907,zoom: parseInt(params.get('zoom')) || 7};}function updateUrlParams(center, zoomLevel) {const newUrl = `${window.location.pathname}?lon=${center.lng.toFixed(4)}&lat=${center.lat.toFixed(4)}&zoom=${zoomLevel}`;history.replaceState(null, '', newUrl);}function setMapView(center, zoomLevel) {map.setView(center, zoomLevel, { animate: true });updateUrlParams(center, zoomLevel);}const { lon, lat, zoom: zoomLevel } = getUrlParams();var map = L.map("map").setView([lat, lon], zoomLevel);L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {attribution: '© <a href="https://www.openstreetmap.org/copyright" target="_blank">OpenStreetMap</a> | <a href="https://www.cbs.nl/nl-nl" target="_blank">CBS</a> | <a href="https://openinfo.nl/" target="_blank">OpenInfo.nl</a>'}).addTo(map);var previousCenter = map.getCenter();function generatePopupContent(feature) {return `<div class="popup"><a href="/${feature.id}" target="_blank"><div class="popup-image" style="background-image: url('/kaart-${feature.properties.Url_kaart}.jpg');"></div></a><div class="popup-content"><div class="popup-header"><strong class="popup-name">${feature.properties.Regionaam}</strong><div class="popup-text">${feature.properties.Tekst_popup}</div></div></div><div class="popup-buttons"><button class="popup-button-close">Sluit</button><a href="/${feature.id}/" target="_blank" class="popup-button-view" style="color:white;">Bekijk statistieken</a></div></div>`;}let highlightedLayer = null;function onEachFeature(feature, layer) {if (feature.properties) {var popupContent = generatePopupContent(feature);layer.bindPopup(popupContent);layer.on('popupopen', function() {var popupElement = layer.getPopup().getElement();var closeButton = popupElement.querySelector('.popup-button-close');if (closeButton) {closeButton.addEventListener('click', function() {layer.closePopup();});}});layer.on('click', function() {if (highlightedLayer) {highlightedLayer.setStyle({ color: colors[zoomLevels[map.getZoom()]], weight: 3, opacity: 1,fillOpacity: 0.1 });}layer.setStyle({ color: colors['Gekozen_gebied'], weight: 3, opacity: 1,fillOpacity: 0.5 }).bringToFront();highlightedLayer = layer;});}}let currentLayers = [];function calculateGridSize(zoomLevel) {return 360 / Math.pow(2, zoomLevel);}function getGridCoordinates(lat, lng, zoomLevel) {const gridSize = calculateGridSize(zoomLevel);const gridX = Math.floor((lng + 180) / gridSize);const gridY = Math.floor((lat + 90) / gridSize);return { gridX, gridY };}function getVisibleGridCoordinates(bounds, zoomLevel) {const gridSize = calculateGridSize(zoomLevel);const { gridX: minGridX, gridY: minGridY } = getGridCoordinates(bounds.getSouthWest().lat, bounds.getSouthWest().lng, zoomLevel);const { gridX: maxGridX, gridY: maxGridY } = getGridCoordinates(bounds.getNorthEast().lat, bounds.getNorthEast().lng, zoomLevel);return { minGridX, maxGridX, minGridY, maxGridY };}function isWithinNetherlands(lat, lng) {const minLat = 50.75;const maxLat = 53.55;const minLng = 3.36;const maxLng = 7.23;return lat >= minLat && lat <= maxLat && lng >= minLng && lng <= maxLng;}function calculateVisibleAreaSize(bounds) {const southWest = bounds.getSouthWest();const northEast = bounds.getNorthEast();const distance = map.distance(southWest, northEast);return distance;}function getMoveEndThreshold(zoomLevel) {const bounds = map.getBounds();const visibleAreaSize = calculateVisibleAreaSize(bounds);const fraction = 0.2;return visibleAreaSize * fraction;}function showLoadingSpinner() {document.getElementById('loading-spinner').style.display = 'block';}function hideLoadingSpinner() {document.getElementById('loading-spinner').style.display = 'none';}function loadGeoJSON() {let zoomLevel = map.getZoom();const bounds = map.getBounds();let geojsonZoomLevel = zoomLevel;if (zoomLevel >= 14 && zoomLevel < 17) {geojsonZoomLevel = 14;} else if (zoomLevel >= 17) {geojsonZoomLevel = 16;}const { minGridX, maxGridX, minGridY, maxGridY } = getVisibleGridCoordinates(bounds, geojsonZoomLevel);let geojsonUrls = [];for (let x = minGridX; x <= maxGridX; x++) {for (let y = minGridY; y <= maxGridY; y++) {const minx = x * calculateGridSize(geojsonZoomLevel) - 180;const miny = y * calculateGridSize(geojsonZoomLevel) - 90;const maxx = (x + 1) * calculateGridSize(geojsonZoomLevel) - 180;const maxy = (y + 1) * calculateGridSize(geojsonZoomLevel) - 90;const centerX = (minx + maxx) / 2;const centerY = (miny + maxy) / 2;if (isWithinNetherlands(centerY, centerX)) {if (geojsonZoomLevel >= 16) {geojsonUrls.push(`/geo_postcode/geo_${geojsonZoomLevel}_${x}_${y}.geojson`);} else {geojsonUrls.push(`/geo_gebieden/geo_${geojsonZoomLevel}_${x}_${y}.geojson`);}}}}currentLayers.forEach(layer => map.removeLayer(layer));let allFeatures = [];showLoadingSpinner();Promise.all(geojsonUrls.map(url => fetch(url).then(response => {if (!response.ok) {throw new Error(`Failed to load ${url}`);}return response.json();}).catch(error => {console.error('Error loading the GeoJSON file:', error);return null;}))).then(dataArray => {dataArray.forEach(data => {if (data && data.features && data.features.length > 0) {allFeatures = allFeatures.concat(data.features);}});const uniqueFeatures = deduplicateFeatures(allFeatures);const layer = L.geoJSON(uniqueFeatures, {style: function () {return {color: colors[zoomLevels[zoomLevel]],weight: 3, opacity: 1,fillOpacity: 0.1 };},onEachFeature: onEachFeature}).addTo(map);currentLayers.push(layer);}).catch(error => console.error('Error processing the GeoJSON files:', error)).finally(() => {hideLoadingSpinner(); });}function deduplicateFeatures(features) {const seen = new Set();return features.filter(feature => {const id = feature.id || JSON.stringify(feature.geometry);if (seen.has(id)) {return false;}seen.add(id);return true;});}function updateDropdownButton(level) {const dropdownButton = document.getElementById('zoomDropdown');dropdownButton.textContent = `${level}`;dropdownButton.style.backgroundColor = colors[level];dropdownButton.style.color = 'black';}document.querySelectorAll('.dropdown-item').forEach(item => {item.addEventListener('click', function(e) {const zoomLevel = parseInt(this.getAttribute('data-zoom'));if (!isNaN(zoomLevel)) {e.preventDefault();const level = zoomLevels[zoomLevel];setMapView(map.getCenter(), zoomLevel);updateDropdownButton(level);}});});loadGeoJSON();updateDropdownButton(zoomLevels[zoomLevel]);map.on('zoomend', function() {const center = map.getCenter();const zoomLevel = map.getZoom();loadGeoJSON();updateDropdownButton(zoomLevels[zoomLevel]); updateUrlParams(center, zoomLevel);});map.on('moveend', function() {const newCenter = map.getCenter();const distance = previousCenter.distanceTo(newCenter);const threshold = getMoveEndThreshold(map.getZoom());if (distance > threshold) {loadGeoJSON();previousCenter = newCenter;updateUrlParams(newCenter, map.getZoom());}});var geocoder = L.Control.Geocoder.nominatim({geocodingQueryParams: {viewbox: '3.31497114423,50.803721015,7.09205325687,53.5104033474',bounded: 1,countrycodes: 'NL'}});var searchMarker;function getZoomLevel(bbox) {var southWest = L.latLng(bbox[0], bbox[2]);var northEast = L.latLng(bbox[1], bbox[3]);var bounds = L.latLngBounds(southWest, northEast);return map.getBoundsZoom(bounds);}function debounce(func, delay) {let timeout;return function(...args) {clearTimeout(timeout);timeout = setTimeout(() => func.apply(this, args), delay);};}function handleSearchInput(e) {const query = e.target.value;if (query.length < 3) {document.getElementById('search-results').innerHTML = ''; return;}document.getElementById('search-results').innerHTML = '<div class="list-group-item">Laden...</div>';geocoder.geocode(query, function(results) {var searchResultsContainer = document.getElementById('search-results');searchResultsContainer.innerHTML = '';if (results.length > 0) {results.forEach(function(result) {var addressType = result.properties.addresstype;var description = addressType ? `${result.name} (${addressTypeTranslations[addressType] || ''})` : `${result.name}`;var resultItem = document.createElement('a');resultItem.className = 'list-group-item list-group-item-action';resultItem.href = '';resultItem.textContent = description;resultItem.addEventListener('click', function(e) {e.preventDefault(); var zoomLevel = getZoomLevel(result.properties.boundingbox) || 13;setMapView(result.center, zoomLevel);loadGeoJSON();updateDropdownButton(zoomLevels[zoomLevel]);if (searchMarker) {map.removeLayer(searchMarker);}searchMarker = L.marker(result.center).addTo(map);document.getElementById('search-results').innerHTML = '';});searchResultsContainer.appendChild(resultItem);});var additionalMessage = document.createElement('div');additionalMessage.className = 'list-group-item';additionalMessage.textContent = 'Zoek je iets anders? Probeer een langere (volledige) zoekterm...';searchResultsContainer.appendChild(additionalMessage);} else {searchResultsContainer.innerHTML = '<div class="list-group-item">Nog geen resultaat gevonden, probeer een langere of andere zoekterm...</div>';}});}document.getElementById('search-box').addEventListener('input', debounce(handleSearchInput, 600));</script><script>function topFunction() { document.body.scrollTop = 0; document.documentElement.scrollTop = 0; }</script></body></html>