当我点击银行时，所有银行图标都会出现，当我点击 parking 和商店时，会出现必填字段。
我的问题是当我点击 parking 时其他标记不应该可见。
<!DOCTYPE html>
<html>
<head>
<style>
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
</style>
<script src="https://maps.googleapis.com/maps/api/js? v=3.exp&sensor=true&libraries=places"></script>
<script>
var marker;
var map;
var infowindow = new google.maps.InfoWindow();
var myCenter;
function initialize()
{
myCenter = new google.maps.LatLng(13.052413899999994,80.25065293862303);
map = new google.maps.Map(document.getElementById('map-canvas'), {
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: myCenter,
zoom: 15
});
}
function some()
{
var request = {
location: myCenter,
radius: 500,
types: ['bank']
};
var service = new google.maps.places.PlacesService(map);
service.nearbySearch(request, 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;
marker = new google.maps.Marker({
position: place.geometry.location
});
marker.setIcon({
url:'bank.png',
size: new google.maps.Size(70, 71),
anchor: new google.maps.Point(17, 14),
scaledSize: new google.maps.Size(35, 35)
});
marker.setMap(map);
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(place.name);
infowindow.open(map, this);
});
}
}
function parking()
{
var request = {
location: myCenter,
radius: 500,
types: ['parking']
};
var service = new google.maps.places.PlacesService(map);
service.nearbySearch(request, 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;
marker = new google.maps.Marker({
position: place.geometry.location
});
marker.setIcon({
url:'parking.png',
size: new google.maps.Size(70, 71),
anchor: new google.maps.Point(17, 14),
scaledSize: new google.maps.Size(35, 35)
});
marker.setMap(map);
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(place.name);
infowindow.open(map, this);
});
}
}
function stores()
{
var request = {
location: myCenter,
radius: 1000,
types: ['store']
};
var populationOptions = {
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000',
fillOpacity: 0.35,
map: map,
center: myCenter,
radius: 1000
};
var cityCircle = new google.maps.Circle(populationOptions);
var service = new google.maps.places.PlacesService(map);
service.nearbySearch(request, 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;
marker = new google.maps.Marker({
position: place.geometry.location
});
marker.setIcon({
url:'store.png',
size: new google.maps.Size(70, 71),
anchor: new google.maps.Point(17, 14),
scaledSize: new google.maps.Size(35, 35)
});
marker.setMap(map);
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(place.name);
infowindow.open(map, this);
});
}
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas" style="width: 50%; float:left"></div>
<div style="width:46%; float:left">
<button onclick="some();">Banks</button>
<button onclick="parking();">Parking</button>
<button onclick="stores();">Store</button>
</body>
</html>
最佳答案
将标记保存在数组中。当您重新运行查询时，处理该数组，通过将标记的映射属性设置为 null 来隐藏标记，然后删除它们。相关变更如下。
var markers = [];
function createMarker(place)
{
var placeLoc = place.geometry.location;
marker = new google.maps.Marker({
position: place.geometry.location
});
marker.setIcon({
url:'bank.png',
size: new google.maps.Size(70, 71),
anchor: new google.maps.Point(17, 14),
scaledSize: new google.maps.Size(35, 35)
});
marker.setMap(map);
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(place.name);
infowindow.open(map, this);
});
markers.push(marker);
}
function callback(results, status) {
if (status == google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < markers.length; i++) {
markers[i].setMap(null);
}
markers = [];
for (var i = 0; i < results.length; i++) {
createMarker(results[i]);
}
}
}
关于javascript - 删除 google map 地点服务中的标记，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19424002/