Question

我正在使用Google Maps API v3和MarkerClustererPlus库。我不希望使用栅格图标，而是使用MarkerClusterer对象的styles和ClusterClass属性渲染气泡。这是JS代码中的style对象：

var myClusterStyle = [{
        url: './icons/placeholder.png', //1x1 transparent png
        height: 40,
        width: 40,
        textColor: '#636363',
        textSize: 12
}];

CSS课程：

.cluster {
    background-color: #EAE6DE;
    border-radius: 50%;
    border: 3px solid #ACCCFD;
    position: absolute; 
}

所以，这些是带有蓝色边框的灰色气泡。

我的问题是：

我想在鼠标悬停时更改单个气泡的某些属性，让我们说改变颜色或添加阴影。我可以更改泡泡的CSS类吗？我花了很多时间试图解决这个问题，现在我陷入困境。我有这个事件：

google.maps.event.addListener(mc,'mouseover',function(c){

    c.clusterIcon_.setValues({className_:'clusterHover'});
});

它确实改变了气泡的CSS类选项，但显示不会改变...... mc.repaint(), c.clusterIcon_.draw()之后没有帮助。

我见过这个帖子： Marker Clusterer Plus change icon on hover 但这是为了更改图标，而不是样式属性。如果不修改库，这真的有可能吗？任何帮助将不胜感激。

Answer 1

您可以直接设置div的类：

c.clusterIcon_.div_.className='clusterHover'

但是当你使用:hover - 伪类

时会更容易

.cluster:hover {
    /* some styles */
}

markerclustererplus css在悬停时更改

1 个答案: