0

I used google map api 3 to locate stores on google maps based on address entered by user. Address to latlong conversion is done using geocoding and my code just working fine. Now my client wants me to plot stores in searched area along with stores near to that area (2 miles near) and calculating their distance. An example of what I want is this site and this one. My working Javascript is as below

var markers = response.d.split('^^');
            var latlng = new google.maps.LatLng(51.474634, -0.195791);
            var mapOptions1 = {
                zoom: 14,
                center: latlng
            }
            var geocoder = new google.maps.Geocoder();
            var infoWindow = new google.maps.InfoWindow();
            var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions1);
            for (i = 0; i < markers.length; i++) {
                var data = markers[i];
                geocoder.geocode({ 'address': data }, function (results, status) {
                    if (status == google.maps.GeocoderStatus.OK) {
                        map.setCenter(results[0].geometry.location);



                        var marker = new google.maps.Marker({
                            map: map,
                            position: results[0].geometry.location,
                            title: results[0].formatted_address
                        });


                    } else {
                        alert("Geocode was not successful for the following reason: " + status);
                    }
                });

            }
            (function (marker, data) {

                // Attaching a click event to the current marker
                google.maps.event.addListener(marker, "click", function (e) {
                    infoWindow.setContent(data);
                    infoWindow.open(map, marker);
                });
            })(marker, data);

above code looks strange, I did initialization on body onload and my array of markers has all addresses and geocode convert those to latlong and marker plots them. I want api to give me nearer address and distance from searched location to every store. How can I get that?

Update

Distance calculation can be done using MrUpsidown's answer but I am not able to get nearby places. I went here and found https://maps.googleapis.com/maps/api/place/search/json?location=-33.8670522,151.1957362&radius=7500&types=library&sensor=false&key=AIzaSyDRn2crkKMALHkQAOyadm-d2u_bIPeBA1o that gives be data but I don't know how to read that effectively, as recommended I tried to get this in jason using below code

$.getJSON("https://maps.googleapis.com/maps/api/place/search/json?location=-33.8670522,151.1957362&radius=7500&types=library&sensor=false&key=AIzaSyDRn2crkKMALHkQAOyadm-d2u_bIPeBA1o", function (data) {
                alert(data);
            });

but no luck :( what am I missing?

Imad
  • 7,126
  • 12
  • 55
  • 112
  • When you are given an answer to a question, the least you can do is to give a feedback whether it works or not, and eventually accept / rate the answer that was given to you. – MrUpsidown Jul 10 '14 at 10:19
  • I had solved lot of those questions myself and due to time and resource limitations could not post my own answer but I don't think that should cause down-vote. – Imad Jul 10 '14 at 10:26
  • 1
    I canceled my downvote since you took action on the previous question. Keep in mind that giving answers and helping others is also time consuming and we give you our time for free! See my answer below. – MrUpsidown Jul 10 '14 at 11:42
  • 1
    Stop using `alert()` to debug your code! Use your javascript console and `console.log()`. This way you would find out what the problem is: [Read more here](http://stackoverflow.com/questions/15005500/loading-cross-domain-html-page-with-jquery-ajax/17299796#17299796). Easy fix: don't use an AJAX request for your places search, but use the [Places Library](https://developers.google.com/maps/documentation/javascript/places). – MrUpsidown Jul 14 '14 at 09:16

1 Answers1

1

You have to calculate the distance by yourself. You can use the geometry library and the computeDistanceBetween method.

For example:

var latlng = new google.maps.LatLng(51.474634, -0.195791);

then in the geocoder:

var distance = google.maps.geometry.spherical.computeDistanceBetween(latlng, results[0].geometry.location);

You will need to store these markers and their distance in an array and sort them if you want them to be displayed in a specific order.

MrUpsidown
  • 21,592
  • 15
  • 77
  • 131