Question

我有一张使用Gmap3和RichMarker的地图，它在大多数情况下都有效。唯一需要注意的是，您无法悬停或点击标记或群集。我认为这是一个简单的CSS问题，但事实并非如此。即使将鼠标悬停在标记上方，光标也不会发生变化，如图所示：http://imgur.com/oSQbXiI。

标记的代码从：https://gist.github.com/anonymous/d94d4476875cf58413b2#file-map-javascript-php-L133

的第133行（或问题下方）开始

我无法弄清楚为什么光标甚至无法改变。即使在普通的Google地图上，当您将鼠标悬停在标记上时，光标也会变为指针。：/

,marker: {
    values: [
        {foreach $items as $item}
            {
                latLng: [{ifset $item->optionsDir['gpsLatitude']}{!$item->optionsDir['gpsLatitude']}{else}0{/ifset},{ifset $item->optionsDir['gpsLongitude']}{!$item->optionsDir['gpsLongitude']}{else}0{/ifset}],
                data: '<div class="marker-holder"><div class="marker-content{ifset $item->thumbnailDir} with-image"><a href="{!$item->link}"><img src="{thumbnailResize $item->thumbnailDir, w => 280, h => 160}" alt="">{else}">{/ifset}<div class="map-item-info"><div class="title">&#36;'+{ifset $item->optionsDir["price"]}{$item->optionsDir["price"]}+{/ifset}' <small>{!$item->rooms}bd/{!$item->baths}ba</small></div><div class="address">'+{ifset $item->optionsDir["address"]}{$item->optionsDir["address"]|nl2br}+{/ifset}',<br>'+{ifset $item->optionsDir["address2"]}{$item->optionsDir["address2"]|nl2br}+{/ifset}'</div><div class="timestamp">{!$item->time}</div></div></a><div class="arrow"></div><div class="close">x</div></div></div></div>'
            }
        {if !($iterator->last)},{/if}
        {/foreach}
    ],
    options:{
        draggable: false,
        content: "<div class='cluster-bg'><div class='cluster'><span>1</span></div></div>",
        width: 44,
        shadow: 0,
        height: 44
    },
    cluster:{
        radius: 100,
        // This style will be used for clusters with more than 0 markers
        0: {
            content: "<div class='cluster-bg'><div class='cluster cluster-1'><span>CLUSTER_COUNT</span></div></div>",
            width: 44,
            height: 44
        },
        events: {
            click: function(cluster) {
                map.panTo(cluster.main.getPosition());
                map.setZoom(map.getZoom() + 2);
            },
            mouseover: function(cluster) {
                $(cluster.main.getDOMElement()).find('.cluster-bg').css('padding', '10px 10px');
                $(cluster.main.getDOMElement()).find('.cluster-bg').css('margin', '-4px 0 0 -4px');
                $(cluster.main.getDOMElement()).find('.cluster-bg').css('background-color', 'rgba(0,0,0,0.2)');
                $(cluster.main.getDOMElement()).find('.cluster').css('background-color', '#343434');
            },
            mouseout: function(cluster) {
                $(cluster.main.getDOMElement()).find('.cluster-bg').css('padding', '6px');
                $(cluster.main.getDOMElement()).find('.cluster-bg').css('margin', '0');
                $(cluster.main.getDOMElement()).find('.cluster-bg').css('background-color', 'rgba(0,0,0,0.15)');
                $(cluster.main.getDOMElement()).find('.cluster').css('background-color', 'rgba(85, 151, 183, 1.0)');
            }
        }
    },
    events: {
        click: function(marker, event, context){
            map.panTo(marker.getPosition());

            infobox.setContent(context.data);
            infobox.open(map,marker);

            // if map is small
            var iWidth = 260;
            var iHeight = 300;
            if((mapDiv.width() / 2) < iWidth ){
                var offsetX = iWidth - (mapDiv.width() / 2);
                map.panBy(offsetX,0);
            }
            if((mapDiv.height() / 2) < iHeight ){
                var offsetY = -(iHeight - (mapDiv.height() / 2));
                map.panBy(0,offsetY);
            }

        }
    }
}

Answer 1

这是Gmaps API实验版的常见问题。修复方法是通过将"v=3.16"标记到URL的末尾来恢复到以前版本的脚本，例如：

http://maps.google.com/maps/api/js?v=3.16

非常感谢geocodezip指出我的问题与其他许多问题之间的相似性。

Gmap3标记可见，但不能与它们交互

1 个答案: