How to mark a special place on google map api on google initial load

Question

I am trying to get a place name from the user and mark it on the google map, on initial map load. So what I do is I get the place name and zoom value using session from another page, and place it in map attributes. The zoom part works ok, but the marking part does not work, I have worked on it a lot and tried different things, but this is my latest version of the code and it shows no marking on the map, and there is no error as well.

This is my code:

 var infowindow = new google.maps.InfoWindow();
    var service = new google.maps.places.PlacesService(map);

var myStyles =[
    {
        featureType: "poi",
        elementType: "labels",
        stylers: [
              { visibility: "off" }
        ]
    }
]; 

    function initialize() {

        var zm = <%= Session["value2"]%>;
        var ft= '<%= Request.QueryString["value"] %>';



        navigator.geolocation.getCurrentPosition(function (position) {
            var latlng2 = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);

                map = new google.maps.Map(document.getElementById('map'), {

                    center: latlng2,
                    zoom: zm,
                    styles: myStyles
                });

                var request2 = {
                    location: latlng2,
                    radius: 2000,
                    types: [ft]
                };
                service.nearbySearch(request2, callback);
            });
}


            function callback(results, status) {

                if (status == google.maps.places.PlacesServiceStatus.OK) {
                    for (var i = 0; i < results.length; i++) {

                        createMarker(results[i],icon);

                    }
                }
            }


            function createMarker(place,icon) {
                var placeLoc = place.geometry.location;
                var marker = new google.maps.Marker({
                    map: map,
                    position: place.geometry.location,
                    icon: icon,
                    visible:true  

                });




                markersArray.push(marker);
                google.maps.event.addListener(marker, 'click', function() {
                    infowindow.setContent("<b>Name:</b>"+place.name+"<br><b>Address:</b>"+place.vicinity);
                    infowindow.open(map, this);
                });

            }

I will be so thankful if you help me.

Please provide a [mcve] that demonstrates your issue. I doubt the geolocation is required (unless the issue is that it isn't working). — geocodezip, Oct 16 '16 at 00:07

score 1 · Answer 1 · answered Oct 15 '16 at 23:54

1

the console clearly says:

TypeError: service.nearbysearch is not a function

the function is actually nearbySearch not nearbysearch as per GOOGLE MAPS API DOCUMENTAION

answered Oct 15 '16 at 23:54

mrahmat

617
6
21

Fixed it, the error is gone, but still does not mark any place. – user2266688 Oct 15 '16 at 23:58
try testing out if your call back status is `OK`, you can do that by having an `else` for your `if control`, log anything in the else part to see if its not `OK` – mrahmat Oct 16 '16 at 00:01

How to mark a special place on google map api on google initial load

1 Answers1