Question

Infowindow没有在谷歌地图的正确位置展示，所有信息都显示在同一点。

我从数据库动态获取记录并在单个地图上显示多个标记。

<script language="javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/tags/markerwithlabel/1.1.8/src/markerwithlabel.js"></script>
    <script type="text/javascript">




var markers = [
            ['<div style="float:left;"><span style="float:left; margin-right:5px;"><a href="property-detail.php?ml_num=2620768"><img src="cropImage.php?image=http://links.mlslirealtor.com/mlsphotos/full/1/768/2620768.jpg&w=40&h=40" width="40" height="40" border="0" ></a></span><span style="float:left; text-align:center;">22-13 Steinway St<br>NY, 11103</span></div>', 40.772327, -73.906257],['<div style="float:left;"><span style="float:left; margin-right:5px;"><a href="property-detail.php?ml_num=2618343"><img src="cropImage.php?image=http://links.mlslirealtor.com/mlsphotos/full/1/343/2618343.jpg&w=40&h=40" width="40" height="40" border="0" ></a></span><span style="float:left; text-align:center;">44-09 Broadway<br>NY, 11103</span></div>', 40.7584945, -73.9185441],['<div style="float:left;"><span style="float:left; margin-right:5px;"><a href="property-detail.php?ml_num=2563251"><img src="cropImage.php?image=http://links.mlslirealtor.com/mlsphotos/full/1/251/2563251.jpg&w=40&h=40" width="40" height="40" border="0" ></a></span><span style="float:left; text-align:center;">48-15 31 Ave<br>NY, 11103</span></div>', 41.440565, -74.392076],['<div style="float:left;"><span style="float:left; margin-right:5px;"><a href="property-detail.php?ml_num=2474854"><img src="cropImage.php?image=http://links.mlslirealtor.com/mlsphotos/full/1/854/2474854.jpg&w=40&h=40" width="40" height="40" border="0" ></a></span><span style="float:left; text-align:center;">30-62 36th St<br>NY, 11103</span></div>', 40.7635902, -73.9188238],['<div style="float:left;"><span style="float:left; margin-right:5px;"><a href="property-detail.php?ml_num=2641580"><img src="cropImage.php?image=http://links.mlslirealtor.com/mlsphotos/full/1/580/2641580.jpg&w=40&h=40" width="40" height="40" border="0" ></a></span><span style="float:left; text-align:center;">25-92 36th St<br>NY, 11103</span></div>', 40.767123, -73.916005]         ];



var labels = ["$199k","$3.20k","$65.80k","$1.88m","$1.50m","$1.80m"];

function initializeMaps() {
    var myOptions = {
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        //mapTypeId: google.maps.MapTypeId.TERRAIN
        mapTypeControl: true
    };
    var map = new google.maps.Map(document.getElementById('map_canvas'),myOptions);
    var infowindow = new google.maps.InfoWindow();
    var marker, i;
    var bounds = new google.maps.LatLngBounds();

    for (i = 0; i < markers.length; i++) {
        var pos = new google.maps.LatLng(markers[i][1], markers[i][2]);
        bounds.extend(pos);             


            var marker = new MarkerWithLabel({
                 position: pos,
                 draggable: true,
                 raiseOnDrag: true,
                 map: map,
                 icon: 'assets/images/home_iconddd.png',
                 labelContent: labels[i],
             //labelAnchor: new google.maps.Point(0, 0),
                labelClass: "labels" // the CSS class for the label
                //labelStyle: {opacity: 0.95}
            });

        google.maps.event.addListener(marker, 'mouseover', (function(marker, i) {
            return function() {
               infowindow.setContent(markers[i][0]);
               infowindow.open(map, marker);
            }
        })(marker, i));
    }
    map.fitBounds(bounds);
}
    </script>
        <div id="map_canvas" style="height:850px"></div>

Answer 1

检查你的addListener，它有一个函数（marker，i）...回调，但你也使用i作为循环变量

我无法测试（你没有提供完整的代码），所以这可能是垃圾：

google.maps.event.addListener(marker, 'mouseover', function() {
               infowindow.setContent(markers[i][0]);
               infowindow.open(map, marker);
            });

Google Map中的Infowindow未在相关点显示

1 个答案: