使用JavaScript v3为Google Map添加多个API API

我一直坚持这几天。我遇到了使用JavaScript API的v3向地图添加多个点的问题。使用JavaScript v3为Google Map添加多个API API

我对SO阅读this thread和this thread也this thread，我已经抓了几个错误，并做出了一些改变，但我仍然不能完全得到什么，除了显示在map_canvas HTML文本。

任何帮助，非常感谢。谢谢。

当前的代码迭代：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { initialize(); }); 

    function initialize() { 
     var map_options = { 
      center: new google.maps.LatLng(33.84659,-84.35686), 
      zoom: 14, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 

     var google_map = new google.maps.Map(document.getElementById("map_canvas"), map_options); 

     var info_window = new google.maps.InfoWindow({ 
      content: 'loading' 
     }); 

     var t = []; 
     var x = []; 
     var y = []; 
     var h = []; 

     t.push('Location Name 1'); 
     x.push(33.84659); 
     y.push(-84.35686); 
     h.push('<p><strong>Location Name 1</strong><br/>Address 1</p>'); 

     t.push('Location Name 2'); 
     x.push(33.846253); 
     y.push(-84.362125); 
     h.push('<p><strong>Location Name 2</strong><br/>Address 2</p>'); 

     var i = 0; 
     for (item in t) { 
      var m = new google.maps.Marker({ 
       map:  google_map, 
       animation: google.maps.Animation.DROP, 
       title:  t[i], 
       position: new google.maps.LatLng(x[i],y[i]), 
       html:  h[i] 
      }); 

      google.maps.event.addListener(m, 'click', function() { 
       info_window.setContent(this.html); 
       info_window.open(map, this); 
      }); 
      i++; 
     } 
    } 
</script> 
<div id="map_canvas" style="width:400px;height:400px;">Google Map</div>

来源

2011-07-08 gtcharlie

你可能还会考虑[gis.se] – jcolebrand

的问题是在这里：

info_window.open(map, this);

它应该是：

info_window.open(google_map, this);

，因为没有可变于此而得名map。这里的工作版本：http://jsfiddle.net/nrabinowitz/2DBXY/

如果您还没有这样做，请尝试使用Firebug或Chrome控制台等工具 - 调试Javascript几乎是不可能的，没有一个。

来源

2011-07-08 22:03:16 nrabinowitz

WOW。它总是这些小事情不是吗？！真的，谢谢。 – gtcharlie

Upvoted现在我有足够的信誉。 – gtcharlie

奇怪的是。我将上面的代码发布在codepen中，它的工作原理与map和google_map一样。我拿出了'info_window.open（map，this）;'这一行，它仍然工作： http://codepen.io/chris0/pen/MbWYEg –

使用JavaScript v3为Google Map添加多个API API

回答

相关问题