未捕获的引用错误:None未定义



javascript新手。尝试将标记列表(来自python)添加到谷歌地图。

我的原始Jinja2模板:

<head>
<title>Google Map Test</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
    #map-canvas { height: 700px; width: 400px; }
</style>
<script type="text/javascript"
  src="https://maps.googleapis.com/maps/api/js?key=MY_API_KEY&sensor=false">
</script>
<script type="text/javascript">
  var locations = {{ locations|safe }};
  /* 
  locations|safe results in the following line in my rendered template:
  var locations = [['A.W. Hastings / Windows & Doors by Brownell', '44.4456', '-73.1276'], ['AARP', '44.4757', '-73.2113'], ['Adirondack Audiology', '44.4792', '-73.22'], ['Alchemy Jewelry Arts #1A', '44.4672', '-73.2147'], ['All Smiles Dental', '44.2334', '-72.5539']];
  */
  function initialize() {
    var mapOptions = {
      center: new google.maps.LatLng(43.953, -72.593),
      zoom: 8,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map-canvas"),
        mapOptions);
  }
  var infowindow = new google.maps.InfoWindow();
  var marker, i;
for (var i = 0; i < locations.length; i++) {
    marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][1], locations[i][2]),
        map: map
    });
    google.maps.event.addListener(marker, 'click', (function(marker, i) {
        return function() {
            infowindow.setContent(locations[i][0]);
            infowindow.open(map, marker);
        }
    })(marker, i));
}
</script>

我从我的视图中发送列表"locations",因为列表定期变化。

我在定义位置变量的行中收到未捕获的引用错误。完整输出为:

Uncaught ReferenceError: None is not defined 127.0.0.1:14(匿名函数)

将函数initialize()后面的代码移动到函数内部,否则在访问变量map的时间和位置都不可用

最新更新