{"id":34,"date":"2025-07-19T18:34:06","date_gmt":"2025-07-19T18:34:06","guid":{"rendered":"https:\/\/wandelkaartje.com\/?page_id=34"},"modified":"2025-07-20T08:08:32","modified_gmt":"2025-07-20T08:08:32","slug":"knooppunten-tool","status":"publish","type":"page","link":"https:\/\/wandelkaartje.com\/index.php\/knooppunten-tool\/","title":{"rendered":"Knooppunten"},"content":{"rendered":"    <style>\n        #knooppunten-kaart { height: 500px; margin-bottom: 1em; }\n        #schema-kaart { width: 300px; border: 1px solid #ccc; padding: 10px; background: #fff; font-size: 14px; }\n        #schema-kaart h4 { margin: 0 0 5px; font-size: 16px; }\n        .schema-knp { font-weight: bold; margin: 2px 0; }\n    <\/style>\n\n    <div id=\"knooppunten-kaart\"><\/div>\n    <button id=\"reset-knoppen\">Reset selectie<\/button>\n    <button id=\"download-schema\">Download schema (PNG)<\/button>\n    <br><br>\n    <div id=\"schema-kaart\">\n        <h4>Gekozen Knooppunten<\/h4>\n        <div id=\"knooppunten-lijst\"><\/div>\n    <\/div>\n\n    <link rel=\"stylesheet\" href=\"https:\/\/unpkg.com\/leaflet\/dist\/leaflet.css\" \/>\n    <link rel=\"stylesheet\" href=\"https:\/\/unpkg.com\/leaflet.markercluster\/dist\/MarkerCluster.css\" \/>\n    <link rel=\"stylesheet\" href=\"https:\/\/unpkg.com\/leaflet.markercluster\/dist\/MarkerCluster.Default.css\" \/>\n    <script src=\"https:\/\/unpkg.com\/leaflet\/dist\/leaflet.js\"><\/script>\n    <script src=\"https:\/\/unpkg.com\/leaflet.markercluster\/dist\/leaflet.markercluster.js\"><\/script>\n    <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/html2canvas@1.4.1\/dist\/html2canvas.min.js\"><\/script>\n\n    <script>\n    document.addEventListener('DOMContentLoaded', function () {\n        var kaart = L.map('knooppunten-kaart').setView([52.0, 5.0], 8);\n        L.tileLayer('https:\/\/{s}.tile.openstreetmap.org\/{z}\/{x}\/{y}.png').addTo(kaart);\n\n        var gekozen = [];\n        var markers = {};\n        var cluster = L.markerClusterGroup();\n\n        function updateLijst() {\n            var lijst = document.getElementById(\"knooppunten-lijst\");\n            lijst.innerHTML = \"\";\n            gekozen.forEach(function(knp, idx) {\n                var div = document.createElement(\"div\");\n                div.className = \"schema-knp\";\n                div.textContent = (idx + 1) + \". Knooppunt \" + knp;\n                lijst.appendChild(div);\n            });\n        }\n\n        function resetSelectie() {\n            gekozen = [];\n            updateLijst();\n            Object.values(markers).forEach(marker => marker.setIcon(defaultIcon));\n        }\n\n        var defaultIcon = L.icon({\n            iconUrl: 'https:\/\/unpkg.com\/leaflet@1.9.4\/dist\/images\/marker-icon.png',\n            shadowUrl: 'https:\/\/unpkg.com\/leaflet@1.9.4\/dist\/images\/marker-shadow.png'\n        });\n\n        var selectedIcon = L.icon({\n            iconUrl: 'https:\/\/maps.google.com\/mapfiles\/ms\/icons\/red-dot.png',\n            iconSize: [32, 32],\n            iconAnchor: [16, 32]\n        });\n\n        fetch('https:\/\/wandelkaartje.com\/wp-content\/plugins\/knooppunten-kaart-schema-cluster\/knooppunten-volledig.json')\n            .then(resp => resp.json())\n            .then(data => {\n                data.forEach(punt => {\n                    var marker = L.marker([punt.lat, punt.lon], { icon: defaultIcon })\n                        .bindPopup(\"Knooppunt: \" + punt.rcn_ref);\n                    marker.on('click', function () {\n                        if (!gekozen.includes(punt.rcn_ref)) {\n                            gekozen.push(punt.rcn_ref);\n                            marker.setIcon(selectedIcon);\n                            updateLijst();\n                        }\n                    });\n                    markers[punt.rcn_ref] = marker;\n                    cluster.addLayer(marker);\n                });\n                kaart.addLayer(cluster);\n            });\n\n        document.getElementById(\"reset-knoppen\").addEventListener(\"click\", resetSelectie);\n\n        document.getElementById(\"download-schema\").addEventListener(\"click\", function () {\n            html2canvas(document.getElementById(\"schema-kaart\")).then(canvas => {\n                var link = document.createElement(\"a\");\n                link.download = \"knooppunten-schema.png\";\n                link.href = canvas.toDataURL();\n                link.click();\n            });\n        });\n    });\n    <\/script>\n    \n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-34","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Knooppunten - Wandelkaartje<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/wandelkaartje.com\/index.php\/knooppunten-tool\/\" \/>\n<meta property=\"og:locale\" content=\"nl_NL\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Knooppunten - Wandelkaartje\" \/>\n<meta property=\"og:url\" content=\"https:\/\/wandelkaartje.com\/index.php\/knooppunten-tool\/\" \/>\n<meta property=\"og:site_name\" content=\"Wandelkaartje\" \/>\n<meta property=\"article:modified_time\" content=\"2025-07-20T08:08:32+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Geschatte leestijd\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minuut\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/wandelkaartje.com\/index.php\/knooppunten-tool\/\",\"url\":\"https:\/\/wandelkaartje.com\/index.php\/knooppunten-tool\/\",\"name\":\"Knooppunten - Wandelkaartje\",\"isPartOf\":{\"@id\":\"https:\/\/wandelkaartje.com\/#website\"},\"datePublished\":\"2025-07-19T18:34:06+00:00\",\"dateModified\":\"2025-07-20T08:08:32+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/wandelkaartje.com\/index.php\/knooppunten-tool\/#breadcrumb\"},\"inLanguage\":\"nl-NL\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/wandelkaartje.com\/index.php\/knooppunten-tool\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/wandelkaartje.com\/index.php\/knooppunten-tool\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/wandelkaartje.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Knooppunten\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/wandelkaartje.com\/#website\",\"url\":\"https:\/\/wandelkaartje.com\/\",\"name\":\"Wandelkaartje\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/wandelkaartje.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/wandelkaartje.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"nl-NL\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/wandelkaartje.com\/#organization\",\"name\":\"Wandelkaartje\",\"url\":\"https:\/\/wandelkaartje.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"nl-NL\",\"@id\":\"https:\/\/wandelkaartje.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/wandelkaartje.com\/wp-content\/uploads\/2025\/05\/20230728_180353-scaled.jpg\",\"contentUrl\":\"https:\/\/wandelkaartje.com\/wp-content\/uploads\/2025\/05\/20230728_180353-scaled.jpg\",\"width\":2560,\"height\":1920,\"caption\":\"Wandelkaartje\"},\"image\":{\"@id\":\"https:\/\/wandelkaartje.com\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Knooppunten - Wandelkaartje","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/wandelkaartje.com\/index.php\/knooppunten-tool\/","og_locale":"nl_NL","og_type":"article","og_title":"Knooppunten - Wandelkaartje","og_url":"https:\/\/wandelkaartje.com\/index.php\/knooppunten-tool\/","og_site_name":"Wandelkaartje","article_modified_time":"2025-07-20T08:08:32+00:00","twitter_card":"summary_large_image","twitter_misc":{"Geschatte leestijd":"1 minuut"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/wandelkaartje.com\/index.php\/knooppunten-tool\/","url":"https:\/\/wandelkaartje.com\/index.php\/knooppunten-tool\/","name":"Knooppunten - Wandelkaartje","isPartOf":{"@id":"https:\/\/wandelkaartje.com\/#website"},"datePublished":"2025-07-19T18:34:06+00:00","dateModified":"2025-07-20T08:08:32+00:00","breadcrumb":{"@id":"https:\/\/wandelkaartje.com\/index.php\/knooppunten-tool\/#breadcrumb"},"inLanguage":"nl-NL","potentialAction":[{"@type":"ReadAction","target":["https:\/\/wandelkaartje.com\/index.php\/knooppunten-tool\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/wandelkaartje.com\/index.php\/knooppunten-tool\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/wandelkaartje.com\/"},{"@type":"ListItem","position":2,"name":"Knooppunten"}]},{"@type":"WebSite","@id":"https:\/\/wandelkaartje.com\/#website","url":"https:\/\/wandelkaartje.com\/","name":"Wandelkaartje","description":"","publisher":{"@id":"https:\/\/wandelkaartje.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/wandelkaartje.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"nl-NL"},{"@type":"Organization","@id":"https:\/\/wandelkaartje.com\/#organization","name":"Wandelkaartje","url":"https:\/\/wandelkaartje.com\/","logo":{"@type":"ImageObject","inLanguage":"nl-NL","@id":"https:\/\/wandelkaartje.com\/#\/schema\/logo\/image\/","url":"https:\/\/wandelkaartje.com\/wp-content\/uploads\/2025\/05\/20230728_180353-scaled.jpg","contentUrl":"https:\/\/wandelkaartje.com\/wp-content\/uploads\/2025\/05\/20230728_180353-scaled.jpg","width":2560,"height":1920,"caption":"Wandelkaartje"},"image":{"@id":"https:\/\/wandelkaartje.com\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/wandelkaartje.com\/index.php\/wp-json\/wp\/v2\/pages\/34","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wandelkaartje.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/wandelkaartje.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/wandelkaartje.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wandelkaartje.com\/index.php\/wp-json\/wp\/v2\/comments?post=34"}],"version-history":[{"count":7,"href":"https:\/\/wandelkaartje.com\/index.php\/wp-json\/wp\/v2\/pages\/34\/revisions"}],"predecessor-version":[{"id":71,"href":"https:\/\/wandelkaartje.com\/index.php\/wp-json\/wp\/v2\/pages\/34\/revisions\/71"}],"wp:attachment":[{"href":"https:\/\/wandelkaartje.com\/index.php\/wp-json\/wp\/v2\/media?parent=34"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}