谷歌地图多标记工具提示仅显示在Firefox 32的第一个标记上

时间:2014-09-16 16:16:24

标签: javascript google-maps firefox google-maps-api-3

以下小提示显示了问题 - 如果您将鼠标悬停在具有多个引脚的地图上,则只有第一个引脚会在Firefox 32上显示标题。您必须在div外部单击以获得另一个引脚以显示标题。我在相关问题上使用了接受答案的小提琴,但它似乎不适用于ff32。

http://jsfiddle.net/msz08tjx/1/

在Chrome上运行正常。在Windows和OSX上测试FF32。我还在Mac上对FF31进行了测试,它有同样的问题。

这里是小提琴的代码:

<script src='https://maps.googleapis.com/maps/api/js?v=3&sensor=false'> </script>
<a href="#" onclick='mapDisplay()'>Show Map</a>
<div id="map" style="width:100%; margin-top:10px; margin-bottom:10px;"></div>

这是JS:

function mapDisplay(){  
    var locations =  [[23.862162, 90.400749, "2014-07-21 03:20:32"], [15.88216, 92.480751, "2014-07-21 03:20:32"], [24.852161, 91.450752, "2014-08-04 08:23:42"], [36.782162, 83.380753, "2014-08-06 10:12:10"]];
    //
    if(locations.length > 0)
    {
        $("#map").css({'height': '600px'});

        var map = new google.maps.Map(document.getElementById('map'), {
            //zoom: 8,
            //center: new google.maps.LatLng(((locations[0][0]+locations[locations.length-1][0])/2), ((locations[0][1]+locations[locations.length-1][1])/2)),
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });

        var marker, point, travelCoordinates = new Array();
        var bounds = new google.maps.LatLngBounds();

        for (var i = 0; i < locations.length; i++) {
            point = new google.maps.LatLng(locations[i][0], locations[i][1]);
            marker = new google.maps.Marker({
                position: point,
                map: map,
                title: locations[i][2]
            });

            travelCoordinates[i] = point 
            bounds.extend(marker.position); 
        }
        map.fitBounds(bounds);
        if(map.getZoom()> 10){
            map.setZoom(10);
        }

        var travelPath = new google.maps.Polyline({
            path: travelCoordinates,
            geodesic: true,
            strokeColor: '#FF0000',
            strokeOpacity: 1.0,
            strokeWeight: 2
        });

        travelPath.setMap(map); 
    }
    else
    {
        $("#map").empty();
        $("#map").css({'background-color': '','height': 'auto'});
        $("#map").html("No records found");
    }   

}

0 个答案:

没有答案