0
我正在试图触发我的google.maps.Animation.DROP
滚动到页面的某个部分。我正在成功触发标记放在地图上;然而,相同的标记会多次落在相同的位置。当地图可见时,是否有一种方法可以让标记掉落一次?Google Maps API标记放在滚动条上
这里是我当前的代码:
var cities = [
//tokyo
{lat: 35.6895, lng: 139.6917},
//fukoka
{lat: 33.5904, lng: 130.4017},
//bangkok
{lat: 13.7563, lng: 100.5018},
//seoul
{lat: 37.5665, lng: 126.9780},
//taipei
{lat: 25.0330, lng: 121.5654},
//hong kong
{lat: 22.3964, lng: 114.1095},
//shanghai
{lat: 31.2304, lng: 121.4737},
//xiamen
{lat: 24.4798, lng: 118.0894},
//macau
{lat: 22.1987, lng: 113.5439},
//phnom penh
{lat: 11.5449, lng: 104.8922},
//vientiane
{lat: 17.9757, lng: 102.6331},
//chiang mai
{lat: 18.7061, lng: 98.9817},
//kyoto
{lat: 35.0116, lng: 135.7680},
//osaka
{lat: 34.6937, lng: 135.5022},
//guam
{lat: 13.4443, lng: 144.7937},
//san francisco
{lat: 37.7749, lng: -122.4194},
//las vegas
{lat: 36.1699, lng: -115.1398},
//los angeles
{lat: 34.0522, lng: -118.2437},
//paris
{lat: 48.8566, lng: 2.3522},
//brussels
{lat: 50.8503, lng: 4.3517},
//amsterdam
{lat: 52.3702, lng: 4.8952}
];
var markers = [];
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
zoom: 4,
center: {lat: 25.0330, lng: 121.5654}
});
}
function drop() {
clearMarkers();
for (var i = 0; i < cities.length; i++) {
addMarkerWithTimeout(cities[i], i * 200);
}
}
function addMarkerWithTimeout(position, timeout) {
window.setTimeout(function() {
markers.push(new google.maps.Marker({
position: position,
map: map,
animation: google.maps.Animation.DROP
}));
}, timeout);
}
function clearMarkers() {
for (var i = 0; i < markers.length; i++) {
markers[i].setMap(null);
}
markers = [];
}
$(window).scroll(function() {
var hT = $('#map').offset().top,
hH = $('#map').outerHeight(),
wH = $(window).height(),
wS = $(this).scrollTop();
if (wS > (hT+hH-wH) && (hT > wS) && (wS+wH > hT+hH)) {
drop();
}
});
怎么样设置变量,一旦您的标记是如此下降的标记他们不会再次下降? – MrUpsidown
@MrUpsidown我试着在drop函数的末尾设置一个布尔型'var dropped = false'并设置'dropped = true',但没有运气...... –
对不起,这段代码似乎很差。为什么每次在Windows滚动时删除和添加标记?你到底在想什么? – krishnar