Guidance Needed 在超时时丢弃地图图钉

Question

尝试在超时的情况下做多个引脚，这样看起来更酷但不起作用

我认为故障可能出在将地图分配为家或简单的 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>

Answer 1

您的代码中有拼写错误（缺少逗号，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)];

working fiddle

Guidance Needed 在超时时丢弃地图图钉

Guidance Needed dropping map pins with timeout

javascript

google-maps

timeout

pins