Google会在鼠标悬停时在同一位置投影上映射多个标记

时间:2014-02-12 10:40:19

标签: javascript jquery html google-maps google-maps-api-3

我有一个谷歌地图,多个标记重叠在同一位置。

因此,我使用此链接https://github.com/jawj/OverlappingMarkerSpiderfier中提供的OverlappingMarkerSpiderfier在点击事件的同一位置显示多个标记。

我想在mouseover事件而不是onclick事件上显示多个标记。

function initialize()
    {
        var lats22 = document.getElementById('lats1').value;
        var lngs22 = document.getElementById('lngs1').value;
        // define map center
        //alert(lats2);
        //var latlng = new google.maps.LatLng(70.44694705960048,-101.953125);
        var latlng = new google.maps.LatLng(lats22,lngs22);

        // define map options
        var myOptions = 
        {
            zoom:9,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.MAP,
            scaleControl: true,
            navigationControl: true,
            navigationControlOptions: {
                style: google.maps.NavigationControlStyle.SMALL
            },
            mapTypeControl: false,
            mapTypeControlOptions: {
                style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
            }
        };

        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
        oms = new OverlappingMarkerSpiderfier(map);

// I have edited click event on oms.addlistener to mouseover as below
        oms.addListener(map, 'mouseover', function(event) {
            findAddress(event.latLng);
            });
    }

这是我编辑的谷歌地图的jsfiddle链接。 单击地图中的标记V以查看差异。我想将此click事件更改为mouseovaer事件。

http://jsfiddle.net/5VFeJ/1/

1 个答案:

答案 0 :(得分:1)

在此链接中编辑您的oms js文件

http://247nywebdesign.com/Testing/FitTipper/php/js/oms.min.js

// edit line43 on jsfiddle as below
        oms.addListener(map, 'click', function(event) {
            findAddress(event.latLng);
            });

将其“点击”事件更改为“鼠标悬停”

http://jsfiddle.net/5VFeJ/1/