0
我已經在角度2中添加了Google地圖API的JavaScript。 根據從API中提取的位置在地圖上添加了自定義標記。 我已經在UI上顯示了職位列表。點擊位置後,我想要替換該位置的相應標記圖標並重置所有其他圖標。 以下代碼未按預期工作。在谷歌地圖上更改標記Javascript
我加入這個功能放置在地圖上的標記:
placeMarkers(markers: any, infoWindowContent: any) {
// Display multiple markers on a map
let infoWindow = new google.maps.InfoWindow();
let bounds = new google.maps.LatLngBounds();
let marker;
// Loop through our array of markers & place each one on the map
for(let i = 0; i < markers.length; i++) {
let position = new google.maps.LatLng(<number>markers[i].lat, <number>markers[i].lang);
bounds.extend(position);
marker = new google.maps.Marker(<google.maps.MarkerOptions>{
position,
map: this.map,
title: markers[i].name,
icon: this.iconUrl,
});
// Allow each marker to have an info window
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infoWindow.setContent(infoWindowContent[i]);
infoWindow.open(this.map, marker);
}
})(marker, i));
// Automatically center the map fitting all markers on the screen
this.map.fitBounds(bounds);
}
}
而這種代碼替換選定位置的標記:
selectSite(site: any, index: any) {
this.placeMarkers(this.finalMarkers, this.finalInfoWindowContent);
let selection = this.finalMarkers.find(function(item) {
return item.name == site.Name
});
let infowindow = new google.maps.InfoWindow();
let position = new google.maps.LatLng(<number>selection.lat, <number>selection.lang);
let redMarker = new google.maps.Marker(<google.maps.MarkerOptions>{
position: position,
map: this.map,
title: selection.name,
icon: {url: require('../../../assets/img/red-marker.png'), scaledSize: {height: 30, width: 20}}
});
redMarker.addListener('click', function() {
infowindow.setContent(selection.name);
infowindow.open(this.map, redMarker);
});
}
上面的代碼是最初工作正常,但之後卡住了多個位置變化。 任何幫助非常感謝!
選擇一個站點後,我想重置所有其他站點並只更改選定的站點。 –