Navigate to Geographical Point<\/title>\n<style>\n #result {\n margin-top: 20px;\n }\n<\/style>\n<\/head>\n<body>\n\n<h1>Navigate to Geographical Point<\/h1>\n\n<div id=\"result\"><\/div>\n\n<script>\nfunction calculateDistanceAndDirection(latitude, longitude, targetLatitude, targetLongitude) {\n \/\/ Calculate distance between two points (in kilometers)\n const earthRadius = 6371; \/\/ Earth's radius in kilometers\n const lat1 = deg2rad(latitude);\n const lon1 = deg2rad(longitude);\n const lat2 = deg2rad(targetLatitude);\n const lon2 = deg2rad(targetLongitude);\n\n const dLat = lat2 - lat1;\n const dLon = lon2 - lon1;\n\n const a = Math.sin(dLat \/ 2) * Math.sin(dLat \/ 2) +\n Math.cos(lat1) * Math.cos(lat2) *\n Math.sin(dLon \/ 2) * Math.sin(dLon \/ 2);\n const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));\n const distance = earthRadius * c;\n\n \/\/ Calculate bearing (direction) between two points\n const y = Math.sin(lon2 - lon1) * Math.cos(lat2);\n const x = Math.cos(lat1) * Math.sin(lat2) -\n Math.sin(lat1) * Math.cos(lat2) * Math.cos(lon2 - lon1);\n const bearing = rad2deg(Math.atan2(y, x));\n\n \/\/ Convert bearing to cardinal direction\n const directions = ['N', 'NE', 'E', 'SE', 'S', 'SW', 'W', 'NW'];\n const index = Math.round((bearing + 360) \/ 45) % 8;\n const direction = directions[index];\n\n return { distance, direction };\n}\n\nfunction deg2rad(deg) {\n return deg * (Math.PI\/180);\n}\n\nfunction rad2deg(rad) {\n return rad * (180\/Math.PI);\n}\n\nfunction getLocation() {\n if (navigator.geolocation) {\n navigator.geolocation.getCurrentPosition(showPosition);\n } else {\n document.getElementById('result').innerHTML = \"Geolocation is not supported by this browser.\";\n }\n}\n\nfunction showPosition(position) {\n const userLatitude = position.coords.latitude;\n const userLongitude = position.coords.longitude;\n const targetLatitude = 52.35751111039642;\n const targetLongitude = 4.918102147096574;\n\n const { distance, direction } = calculateDistanceAndDirection(userLatitude, userLongitude, targetLatitude, targetLongitude);\n\n document.getElementById('result').innerHTML = `You are ${distance.toFixed(2)} kilometers away from the target point. Head ${direction} to get there.`;\n}\n\ngetLocation();\n<\/script>\n\n<\/body>\n<\/html>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Navigate to Geographical Point Navigate to Geographical Point<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-504","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/decharmeur.nl\/index.php\/wp-json\/wp\/v2\/pages\/504","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/decharmeur.nl\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/decharmeur.nl\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/decharmeur.nl\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/decharmeur.nl\/index.php\/wp-json\/wp\/v2\/comments?post=504"}],"version-history":[{"count":34,"href":"https:\/\/decharmeur.nl\/index.php\/wp-json\/wp\/v2\/pages\/504\/revisions"}],"predecessor-version":[{"id":540,"href":"https:\/\/decharmeur.nl\/index.php\/wp-json\/wp\/v2\/pages\/504\/revisions\/540"}],"wp:attachment":[{"href":"https:\/\/decharmeur.nl\/index.php\/wp-json\/wp\/v2\/media?parent=504"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\n\n\n\n\nNavigate to Geographical Point<\/title>\n<style>\n #result {\n margin-top: 20px;\n }\n<\/style>\n<\/head>\n<body>\n\n<h1>Navigate to Geographical Point<\/h1>\n\n<div id=\"result\"><\/div>\n\n<script>\nfunction calculateDistanceAndDirection(latitude, longitude, targetLatitude, targetLongitude) {\n \/\/ Calculate distance between two points (in kilometers)\n const earthRadius = 6371; \/\/ Earth's radius in kilometers\n const lat1 = deg2rad(latitude);\n const lon1 = deg2rad(longitude);\n const lat2 = deg2rad(targetLatitude);\n const lon2 = deg2rad(targetLongitude);\n\n const dLat = lat2 - lat1;\n const dLon = lon2 - lon1;\n\n const a = Math.sin(dLat \/ 2) * Math.sin(dLat \/ 2) +\n Math.cos(lat1) * Math.cos(lat2) *\n Math.sin(dLon \/ 2) * Math.sin(dLon \/ 2);\n const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));\n const distance = earthRadius * c;\n\n \/\/ Calculate bearing (direction) between two points\n const y = Math.sin(lon2 - lon1) * Math.cos(lat2);\n const x = Math.cos(lat1) * Math.sin(lat2) -\n Math.sin(lat1) * Math.cos(lat2) * Math.cos(lon2 - lon1);\n const bearing = rad2deg(Math.atan2(y, x));\n\n \/\/ Convert bearing to cardinal direction\n const directions = ['N', 'NE', 'E', 'SE', 'S', 'SW', 'W', 'NW'];\n const index = Math.round((bearing + 360) \/ 45) % 8;\n const direction = directions[index];\n\n return { distance, direction };\n}\n\nfunction deg2rad(deg) {\n return deg * (Math.PI\/180);\n}\n\nfunction rad2deg(rad) {\n return rad * (180\/Math.PI);\n}\n\nfunction getLocation() {\n if (navigator.geolocation) {\n navigator.geolocation.getCurrentPosition(showPosition);\n } else {\n document.getElementById('result').innerHTML = \"Geolocation is not supported by this browser.\";\n }\n}\n\nfunction showPosition(position) {\n const userLatitude = position.coords.latitude;\n const userLongitude = position.coords.longitude;\n const targetLatitude = 52.35751111039642;\n const targetLongitude = 4.918102147096574;\n\n const { distance, direction } = calculateDistanceAndDirection(userLatitude, userLongitude, targetLatitude, targetLongitude);\n\n document.getElementById('result').innerHTML = `You are ${distance.toFixed(2)} kilometers away from the target point. Head ${direction} to get there.`;\n}\n\ngetLocation();\n<\/script>\n\n<\/body>\n<\/html>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Navigate to Geographical Point Navigate to Geographical Point<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-504","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/decharmeur.nl\/index.php\/wp-json\/wp\/v2\/pages\/504","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/decharmeur.nl\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/decharmeur.nl\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/decharmeur.nl\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/decharmeur.nl\/index.php\/wp-json\/wp\/v2\/comments?post=504"}],"version-history":[{"count":34,"href":"https:\/\/decharmeur.nl\/index.php\/wp-json\/wp\/v2\/pages\/504\/revisions"}],"predecessor-version":[{"id":540,"href":"https:\/\/decharmeur.nl\/index.php\/wp-json\/wp\/v2\/pages\/504\/revisions\/540"}],"wp:attachment":[{"href":"https:\/\/decharmeur.nl\/index.php\/wp-json\/wp\/v2\/media?parent=504"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}