Google Places API展示学校和商店

Question

将Google Maps API与地方图书馆一起使用我可以使用here显示的推荐方法向附近的学校展示。

var map; 
var infowindow; 

function initMap() { 
    var pyrmont = {lat: -33.867, lng: 151.195}; 

    map = new google.maps.Map(document.getElementById('map'), { 
    center: pyrmont, 
    zoom: 15 
    }); 

    infowindow = new google.maps.InfoWindow(); 
    var service = new google.maps.places.PlacesService(map); 
    service.nearbySearch({ 
    location: pyrmont, 
    radius: 500, 
    type: ['store'] 
    }, callback); 
} 

function callback(results, status) { 
    if (status === google.maps.places.PlacesServiceStatus.OK) { 
    for (var i = 0; i < results.length; i++) { 
     createMarker(results[i]); 
    } 
    } 
} 

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

    google.maps.event.addListener(marker, 'click', function() { 
    infowindow.setContent(place.name); 
    infowindow.open(map, this); 
    }); 
} 

这里的工作小提琴：https://jsfiddle.net/api/post/library/pure/

的问题是，如果我也想显示附近的商店和学校，每个人似乎都建议只是这样做：

type: ['store', 'school'] 

虽然这在技术上是有效的，问题在于地图只显示了一堆没有意义的默认标记，而没有办法知道它是什么。

所以我的问题是：如何更改学校和商店的图标？理想情况下，我会为每种不同类型显示不同的图标。

Answer 1

那比常规map.Only东西添加自定义标记不同的是，你需要做的api调用单独为每个type。所以即使type: ['store', 'school']会的工作，你会得到的结果，但没有在results没有类型说明符告诉无论是学校或商店。还有，你需要创建自己的独立的回调，设置它们的单独的图标

function createMarker(place) { 
    var placeLoc = place.geometry.location; 
    var marker = new google.maps.Marker({ 
     icon:"http://example.com/icon.png", //<-- only this line is enough for icon 
     map: map, 
     position: place.geometry.location 
    }); 

经过this为了更好地理解

而且每次的结果将有一个默认的图标（如icon财产），也可以使用

var marker = new google.maps.Marker({ 
     icon:place.icon, 
     map: map, 
     position: place.geometry.location 
});