添加多个点到谷歌地图与Javascript v3 API

Adding multiple points to Google Map with Javascript v3 API

本文关键字：Javascript v3 API 谷歌地图 添加      更新时间：2023-09-26

我已经被这个问题困扰了好几天了。我在使用Javascript API v3向地图添加多个点时遇到了问题。

我在SO上阅读了这个线程和这个线程，我发现了一些错误并做了一些更改，但我仍然不能完全得到任何显示，除了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>

问题就在这里:

info_window.open(map, this);

应该是:

info_window.open(google_map, this);

因为这里没有名为map的变量。这里的工作版本:http://jsfiddle.net/nrabinowitz/2DBXY/

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

相关文章：