How to get landmarks (points of interest) near a given location using Google Places API

Question

I have used Places API to get places such as restaurants and hotels near a given location, and it is working fine. I want to get points of interest or landmarks near the given location as well. What I tried is given below:

var service = new google.maps.places.PlacesService(map);
service.nearbySearch({
        location: latlng,         
        radius: 1500,
    }, function (results, status) {
        if (status === google.maps.places.PlacesServiceStatus.OK) {
            var type1 = results[i].types[0];
            var type2 = results[i].types[1];
            if (type1 == 'point_of_interest' || type2 == 'point_of_interest') {
                //process place details
            }
        }
    });

Eg: For a landmark search near Champ de Mars in Paris, it should return places such as Eiffel Tower, which is quite nearby. However, it returns only places such as hotels and lodging.

How can I get it to return points of interest near the given location? Any help on solving this would be appreciated.

Answer 1

You can use a keyword parameter in places search request. According to the documentation keyword parameter is:

A term to be matched against all available fields, including but not limited to name, type, and address, as well as customer reviews and other third-party content.

So something like keyword: "POI" can make a trick. Please have a look at the following example.

code snippet:

    var map, service;

function initialize() {
    var champdemars = new google.maps.LatLng(48.8556475,2.2986304);
    var mapOptions = {
        zoom:14,
        center: champdemars
    };
    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
    service = new google.maps.places.PlacesService(map);
    service.nearbySearch({
        location: champdemars,         
        radius: 1500,
        keyword: "POI"
    }, function (results, status) {
        if (status === google.maps.places.PlacesServiceStatus.OK) {
            results.forEach(function (p) {
                var m = new google.maps.Marker({
                   position: p.geometry.location,
                   icon: {
                     url: p.icon,
                     scaledSize: new google.maps.Size(24,24)
                   },
                   title: p.name,
                   map: map
                });                  
            });
        } else {
            alert(status);
        }
    });        
}

html,
body,
#map-canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

<div id="map-canvas"></div>
<script async defer src="https://maps.googleapis.com/maps/api/js?v=3&libraries=places&callback=initialize"></script>

As you can see POIs like Eiffel Tower, The Army Museum or UNESCO now appear on the map.