删除谷歌地图位置服务中的标记 [英] Removing Markers In google Maps Places Services
问题描述
我的问题是当我点击停车其他地方时标记不应该是可见的。
When i click in bank all the bank icon appers and when i click on parking and stores the required fields appear.
My problem is when i click on parking other marker should not be visible.< button onclick =some（）;>银行< / button>
< button onclick =parking（）;>泊车< /按钮>
< button onclick =stores（）;> Store< / button>
< / body>
< / html>
<!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>
推荐答案
将标记保存在数组中。当您重新运行查询时，通过该数组进行处理，通过将标记的map属性设置为null来隐藏标记，然后将其删除。以下相关变更。
Save the markers in an array. When you re-run the query, process through that array, hiding the markers by setting their map property to null, then delete them. Relevant changes below.
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]);
}
}
}
这篇关于删除谷歌地图位置服务中的标记的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
