从谷歌地图v3中删除最后添加的标记
removing last added marker from google maps v3
我正在开发一个使用谷歌地图v3的网站,有了它,您可以导航到特定位置
网站 - http://dev.fama.net.pl/walendia/lokalizacja.html
在网站顶部的输入上键入"什切青",然后单击提交 - 地图上将出现一个标记,然后键入"Warszawa" - 新标记将出现在地图上,但旧标记仍然存在,如何从地图中删除以前的标记
谷歌地图代码
var map;
var directionDisplay;
var directionsService = new google.maps.DirectionsService();
var geocoder = new google.maps.Geocoder();
var stepDisplay;
var markersArray = [];
var iconSize = new google.maps.Size(158,59);
var iconOrigin = new google.maps.Point(0,0);
var iconAnchor = new google.maps.Point(20,59);
function initialize(center, zoom) {
directionsDisplay = new google.maps.DirectionsRenderer({suppressMarkers: true});
var mapOptions = {
zoom: zoom,
mapTypeId: google.maps.MapTypeId.ROADMAP,
panControl: false,
zoomControl: true,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.LARGE,
position: google.maps.ControlPosition.TOP_RIGHT
}
}
map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
directionsDisplay.setMap(map);
directionsDisplay.setPanel(document.getElementById('directions-panel'));
geocoder.geocode({address: center}, function(results, status) {
map.setCenter(results[0].geometry.location);
});
}
function addMarker(location, icon) {
geocoder.geocode({address: location}, function(results, status) {
marker = new google.maps.Marker({
position: results[0].geometry.location,
map: map,
icon: icon
});
google.maps.event.addListener(marker);
markersArray.push(marker);
});
}
function addMarker2(position, icon) {
var location = new google.maps.LatLng(52.08901624831595, 20.854395031929016);
var icon = {
url: 'http://dev.fama.net.pl/walendia/img/markers/end.png',
size: iconSize,
origin: iconOrigin,
anchor: iconAnchor
}
marker = new google.maps.Marker({
position: location,
map: map,
icon: icon
});
markersArray.push(marker);
}
function calcRoute(start, end) {
var start = start;
var end = end;
var request = {
origin: start,
destination: end,
travelMode: google.maps.TravelMode.DRIVING
};
directionsService.route(request, function(result, status) {
if (status == google.maps.DirectionsStatus.OK) {
var location = start;
var icon = {
url: 'http://dev.fama.net.pl/walendia/img/markers/start.png',
size: iconSize,
origin: iconOrigin,
anchor: iconAnchor
}
addMarker(location, icon);
addMarker2(location, icon);
directionsDisplay.setDirections(result);
}
});
}
// SET CENTER ON RESIZE
google.maps.event.addDomListener(window, "resize", function() {
var center = map.getCenter();
google.maps.event.trigger(map, "resize");
map.setCenter(center);
directionsDisplay.setMap(map);
});
$(document).ready(function() {
$('.form-box form').submit(function() {
var start = $(this).find('input[name="start"]').val();
var end = new google.maps.LatLng(52.08901624831595, 20.854395031929016);
directionsDisplay.setMap(map);
calcRoute(start, end);
return false;
});
});
网页代码
$(document).ready(function() {
initialize('Łączności 131, 05-552 Łazy, Polska', 10);
addMarker2(location);
});
在添加第二个标记之前,您需要从markersArray
中删除标记。使用以下函数从数组中删除标记。
function deleteMarkers() {
if (markersArray) {
for (i=0; i < markersArray.length; i++) {
markersArray[i].setMap(null);
}
markersArray.length = 0;
}
}
演示小提琴
注意:我只是拿了一些样本来删除并在您单击按钮时显示标记。根据您的要求使用这些函数。
相关文章:
- 通过将6个月添加到今天来获得最后一个月的日期's日期
- 在循环中添加addEventListener()只适用于最后一个按钮
- 在每个固定高度段落的最后一行添加省略号,并隐藏溢出 y
- 添加一个“;以及“;到String-js/Angular中的最后一个单词
- 使jQuery图像滑块停止在最后一个图像,并添加下一个和上一个按钮
- Gmaps API-在循环中添加事件侦听器总是指向最后一个标记
- Javascript事件处理程序总是被添加到数组中的最后一个对象
- jQuery .each:不要在最后一个字段中添加逗号
- 将属性添加到 for 循环中的最后一项
- Jquery- 动态添加字段 - 防止删除最后一个项目
- for 循环中的 addEventListener 始终添加到最后一项
- 当
- 中的最后一个输入具有值时,添加新的<输入>
- 仅将 Javascript 代码添加到最后一个文本区域
- 使用 javascript 在表中动态添加一行,模糊表中的最后一行
- JS将对象推送到变量,将最后一个对象添加到所有元素中
- 为什么我的click函数一直在css表中添加最后一个类
- I'm只向JS数组添加最后一个元素
- 谷歌地图,只添加最后一个信息窗口
- 当我添加最后一个滑块时,所有的jQuery UI效果都会消失
- Jquery如何添加最后键入的字符