尝试在超时的情况下执行多个引脚,这样看起来更酷,但不起作用
我认为故障可能是在将地图指定为主页时,或者是一个简单的var定义问题。你能看到的任何问题都告诉我。我认为动画应该很酷,按钮方法应该确保你看到它,而不是在你向下滚动足够远之前就已经掉下来了
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>LANDMARK LOCATIONS <code>setTimeout()</code></title>
<style>
#map-canvas {
width: 100%;
height: 400px;
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>
<script>
var home = new google.maps.LatLng(39.9176356,-99.3003073);
var neighborhoods = [
new google.maps.LatLng(46.448114-96.736079),
new google.maps.LatLng(45.46104-98.488264),
new google.maps.LatLng(45.460888-98.498119),
new google.maps.LatLng(44.363302-97.134493),
new google.maps.LatLng(43.760871-96.778317),
new google.maps.LatLng(46.888705-103.194951),
new google.maps.LatLng(44.670711-103.850721),
new google.maps.LatLng(43.839003-101.283079),
new google.maps.LatLng(46.832538-100.76937),
new google.maps.LatLng(46.836574-100.781966),
new google.maps.LatLng(30.325508-96.157669),
new google.maps.LatLng(39.094627-94.437796),
new google.maps.LatLng(31.0451-97.165565)
];
var markers = [];
var map;
function initialize() {
var mapOptions = {
zoom: 4,
center: home
};
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
}
function drop() {
clearMarkers();
for (var i = 0; i < neighborhoods.length; i++) {
addMarkerWithTimeout(neighborhoods[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 = [];
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="panel" style="margin-left: 42%">
<button id="drop" onclick="drop()">Drop LANDMarkers</button>
</div>
<div id="map-canvas"></div>
</body>
</html>
您的代码中有拼写错误(缺少逗号,google.maps.LatLng需要两个参数):
var neighborhoods = [
new google.maps.LatLng(46.448114-96.736079),
new google.maps.LatLng(45.46104-98.488264),
new google.maps.LatLng(45.460888-98.498119),
new google.maps.LatLng(44.363302-97.134493),
new google.maps.LatLng(43.760871-96.778317),
new google.maps.LatLng(46.888705-103.194951),
new google.maps.LatLng(44.670711-103.850721),
new google.maps.LatLng(43.839003-101.283079),
new google.maps.LatLng(46.832538-100.76937),
new google.maps.LatLng(46.836574-100.781966),
new google.maps.LatLng(30.325508-96.157669),
new google.maps.LatLng(39.094627-94.437796),
new google.maps.LatLng(31.0451-97.165565)];
应为:
var neighborhoods = [
new google.maps.LatLng(46.448114,-96.736079),
new google.maps.LatLng(45.46104,-98.488264),
new google.maps.LatLng(45.460888, -98.498119),
new google.maps.LatLng(44.363302, -97.134493),
new google.maps.LatLng(43.760871, -96.778317),
new google.maps.LatLng(46.888705, -103.194951),
new google.maps.LatLng(44.670711, -103.850721),
new google.maps.LatLng(43.839003, -101.283079),
new google.maps.LatLng(46.832538, -100.76937),
new google.maps.LatLng(46.836574, -100.781966),
new google.maps.LatLng(30.325508, -96.157669),
new google.maps.LatLng(39.094627, -94.437796),
new google.maps.LatLng(31.0451, -97.165565)];
工作小提琴