Programming
Copyright © 2019 Jiri Kriz, www.nosco.ch
Snippet so7859073
Back to Overview

How to take 5 km points in all directions of a location, geocoding google api?


<!DOCTYPE html>
<!-- http://stackoverflow.com/a/7859073 -->
<html>
<head>
<script type="text/javascript"
    src="http://maps.googleapis.com/maps/api/js?libraries=geometry&sensor=false">
</script>

<script type="text/javascript">
    var spherical;
    var north, east, west, south;

    function initialize() {
        spherical = google.maps.geometry.spherical;

        var point = new google.maps.LatLng(55.623151, 8.48215);
        var myOptions = {
                zoom: 10,
              center: point,
              mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById("map_canvas"),
            myOptions);
       
        createMarker(map, point, "point");
       
        north = spherical.computeOffset(point, 5000, 0);
        createMarker(map, north, "north");
        
        west  = spherical.computeOffset(point, 5000, -90);
        createMarker(map, west, "west");  
        
        south = spherical.computeOffset(point, 5000, 180);
        createMarker(map, south, "south");  

        east  = spherical.computeOffset(point, 5000, 90);
        createMarker(map, east, "east");  
      }
  
        function createMarker(map, point, title) {
         return new google.maps.Marker({
            map: map,
            position: point,
            title: title
        });
    }
    
    function test() {
        alert("north=" + north);
        alert("west=" + west);
        alert("south=" + south);
        alert("east=" + east);
    }       

</script>
</head>

<body onload="initialize()">
<div id="map_canvas" style="width: 400px; height: 400px"></div>
<button onclick="test();">Test</button>
</body>

</html>