1

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>

我从我的视图中发送列表“位置”,因为列表会定期更改。

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

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

4

1 回答 1

2

将函数后面的代码移到函数initialize()内部,否则在您访问它的时间和地点该变量map不可用。

于 2013-05-06T18:01:52.890 回答