我正在尝试开发基于位置的网络应用程序。我在向谷歌添加新标记之前删除以前的标记时遇到问题 地图。用户点击按钮时，地图使用点击事件添加标记。我想删除上一个标记，并在发生点击事件时添加新标记。 为了完成这个任务我也创造了一个功能，但我无法找到我应该称之为功能的地方。在这段代码中，我使用mouseover事件来显示infowindow 它们与标记相关联。当用户将指针移出标记的最后一个标记时，我面临着消失最后信息的问题。 任何人都可以帮我解决这个问题。 这是我的代码......
<script src="https://maps.googleapis.com/maps/api/js?key=v3"></script>
<script>
var find1;
var find2;
var a, b, c, d;
var map;
var arr = [];
var marker;
var rstnearbybikaji = [
[ 28.568884, 77.1868144, 'Aangan, Hyatt Regency Ring Road, Bhikaji Cama Place, R.K. Puram New Delhi, Delhi 110066', 4],
[ 28.5677822, 77.1883104, 'South Indian Food Ansal Chamber-II 6, UG-9, Bhikaji Cama Place, R.K. Puram New Delhi, Delhi 110066', 5],
[ 28.5677822, 77.1872972, 'Snack Bar , Ug 65 & 66, Somdutt Chamber II, 9 Bhikaji Cama Place New Delhi, Delhi 110066', 3],
[ 28.568653, 77.1890415, 'Dominos ,Shop No. 30, 31 & 32, Ansal Chambers 1, Upper Ground Floor, Bhikaji Cama Place,R.K. PuramNew Delhi, Delhi 110066', 2],
[ 28.5686276, 77.1855986, 'La Piazza ,Hyatt Regency Ring Road, Bhikaji Cama Place New Delhi, Delhi 110066', 1]
];
var rstnearbynp =[
[ 28.5481617 , 77.2518832 , ' The First Floor Restaurant and Bar ,104/58 ,Sahyog Nehru Place , New Delhi ,Delhi 110119' ,1],
[ 28.5472051 , 77.2509509 , ' Dominos Pizza , Shop No. 2,3,4,5,6 and Rear Hall Spot No- G-34AB , Kalkaji New Delhi 110119' , 2],
[ 28.5482088 , 77.2513012 , 'Sona Sweets & Udipi Restaurant , Shop No G-1 ,Sawaraswati Tower,27 , Nehru Place New Delhi,Delhi 110048' ,3],
[ 28.54802657 , 77.2515506 ,'How Abt Chicken Today , Building No 25 , Ground Floor Nahru Palce New Delhi , Delhi ,110019 ' ,4],
[ 28.550442 , 77.25055 , 'Oh Calcutta , Lala Lajpat Rai Road Nahru Place New Delhi , Delhi 110019', 5] ,
[ 28.549123 , 77.2514391 , 'Cafe Coffee Day, Nehru Place Metro Station Nehru Place Metro Station, Nehru Place New Delhi, Delhi 110019 ' ,6 ],
[ 28.550442 , 77.25055 ,'The Chatter House ,F-15, S-2-3, Lower Ground Floor, Epicuria Mall Nehru Place New Delhi, Delhi 110019']
];
var rstnearbycp = [
[ 28.634072,77.218780 , 'Zen Restaurants B-25, Connaught Place, Near Rajiv Chowk Metro Station Exit-2 Block B, Connaught Place New Delhi, Delhi 110001 ' , 1 ],
[ 28.632716 ,77.221474, ' United Coffee House ,E15, Inner Circle, Near Adidas Showroom Block E, Connaught Place New Delhi, Delhi 110001 ',2] ,
[ 28.631651 , 77.219899 ,'The Host, F- 8 Inner Circle Rajeev Chowk, Connaught Place New Delhi, Delhi 110001' , 3 ],
[ 28.6315985 ,77.2186665 ,' Taste Of China ,N-18, Outer Circle, Opposite Kasturba Gandhi marg, Connaught Place Block N, Connaught Place New Delhi, Delhi 110001' ,4],
[ 28.6289146 , 77.2152869 ,'Bhowani Junction , 37, Shaheed Bhagat Singh Marg, Connaught Place, Near Shivaji Stadium, Connaught Place Shivaji Stadium, Connaught Place New Delhi, Delhi 110001', 5]
];
var wrnearbybikaji = [
[ 28.566903,77.1880163 , ' Wash Room , Ground Floor ,Somdutt Chamber II, Bhikaji Cama Place New Delhi, Delhi 110066' ,1 ],
[ 28.569521,77.190682 , ' Shulabh Complex , Block F , Nauroji Nagar , R.K. Puram New Delhi, Delhi 110066' , 2],
[ 28.567032,77.189558 ,' Shulabh Complex , A2/11 ,Africa Ave Block A2 , Safdarjung Enclave New Delhi , Delhi 110029' ,3 ]
];
var wrnearbynp = [
[ 28.548298 , 77.249330 , 'Shulabh Complex , 707 Lala Lajpat Rai Road Nahru Place , New Delhi, Delhi ,110019 ' , 1 ],
[ 28.5506388 , 77.2513826 , ' Shulabh Complex , Nehru Palce New Delhi , Delhi 110048' , 2 ]
];
var wrnearbycp = [
[28.631283,77.218708 ,'Shulabh Complex ,Connaught Circus , Connaught Place New Delhi, Delhi 110001' , 1],
[28.632022,77.222667 ,'Shulabh Complex , Block M, Connaught Place New Delhi, Delhi 110001 ' , 2]
];
function initialize() {
var mapOptions = {
zoom: 15,
mapTypeId: google.maps.MapTypeId.ROADMAP ,
center: new google.maps.LatLng(28.567924, 77.188079)
}
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
}
function getlocation() {
find1 = document.getElementById('place');
find2 = document.getElementById('location');
//a = find1.options[find1.selectedIndex].value;
//b = find1.options[find1.selectedIndex].text;
//c = find2.options[find2.selectedIndex].value;
//d = find2.options[find2.selectedIndex].text;
// if (a == "Restaurants" && c == "Bikaji")
{
if ( find1.value == "Restaurants" && find2.value == "Bikaji" )
{
setMarkers(map, rstnearbybikaji);
}
else if ( find1.value == "Restaurants" && find2.value == "Nehru Place" )
{
setMarkers(map , rstnearbynp);
}
else if ( find1.value == "Restaurants" && find2.value == "Cannought Place" )
{
setMarkers(map , rstnearbycp );
}
else if ( find1.value =="Wash Room" && find2.value == "Bikaji" )
{
setMarkers(map , wrnearbybikaji );
}
else if ( find1.value =="Wash Room" && find2.value == "Nehru Place")
{
setMarkers(map , wrnearbynp );
}
else if ( find1.value =="Wash Room" && find2.value == "Cannought Place")
{
setMarkers(map , wrnearbycp );
}
else
{
alert("Please Select Elements from list box ");
}
}
}
function setMarkers(map, locations)
{
for (var i = 0; i < locations.length; i++) {
var rst = locations[i]
var infowindow = new google.maps.InfoWindow();
var myLatLng = new google.maps.LatLng(rst[0], rst[1]);
map.setCenter(myLatLng);
marker = new google.maps.Marker({
position: myLatLng,
map: map,
});
//var content = " Address :" + rst[2];
google.maps.event.addListener(marker, 'mouseover', (function (marker, i) {
return function () {
infowindow.setContent( locations[i][2])
infowindow.open(map, this)
}
})(this, i))
}
arr.push(marker);
}
function clearMarker()
{
for( var i=0; i < arr.length;i++)
{
arr[i].setMap(null);
}
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<body>
<div class="abc">
<form>
<table id="table1">
<tr>
<td>Find:</td>
<td>
<select id="place">
<option value="Restaurants">Restaurants</option>
<option value="Wash Room">Wash Room</option>
<option value="Hotels">Hotels</option>
</select>
</td>
<td id="id1">NearBy:</td>
<td>
<select id="location">
<option value="Nehru Place">Nehru Place</option>
<option value="Bikaji">Bikaji</option>
<option value="Cannought Place">Cannought Place</option>
</select>
</td>
<td id="find">
<input type="button" value="Find" name="search" onclick="getlocation()" style="width:80px " />
</td>
</tr>
</table>
</form>
</div>
<div id="map-canvas"></div>
</body>
</html>
答案 0 :(得分：0)
我在其中一个项目中做了同样的事情。工作顺利！
var gmarkers = []; //declared globally
function removeMarkers() {
for (i = 0; i < gmarkers.length; i++) {
gmarkers[i].setMap(null);
}
}
插入标记时，我习惯在数组中插入标记
gmarkers.push(marker);
根据您的要求调用removeMarkers（）。
答案 1 :(得分：0)
我这样做但是在Angular版本中有效：）
http://plnkr.co/edit/caW6vr?p=preview
angular.module('nowCtrls', []).controller('NowCtrl', function() {
var nc = this;
nc.positions = [];
nc.placeMarker = function(event) {
nc.positions = [];
var loc = event.latLng;
nc.positions.push({
pos: [loc.lat(), loc.lng()]
});
};
}).controller('BuyCtrl', function() {
});