markerclustererplus样式不会居中

Question

我正在使用这个 npm 包

https://github.com/googlemaps/js-markerclustererplus

我正在尝试使样式居中，这就是方法。

let clusterStyle = {
            textColor: 'white',
            textSize: 14,
            url: iconBase + 'pin-cluster-store.png',
            width: 45,
            height: 49
        }


let mc = new MarkerClusterer(map,mapMarkers, {
           maxZoom: 15,
           gridSize: 50,
           styles: clusterStyles
});

这是它的样子

我希望它位于圆心。当我在控制台中添加 padding-top 16px 时，它工作正常。但是当我在“clusterstyle”中以编程方式添加它时，没有任何反应

Answer 1

您需要调整锚点。 https://googlemaps.github.io/js-markerclustererplus/interfaces/ClusterIconStyle.html

anchorIcon?: [number, number]

The anchor position (in pixels) of the cluster icon. This is the spot on the cluster icon that is to be aligned with the cluster position. The format is [yoffset, xoffset] where yoffset increases as you go down and xoffset increases to the right of the top-left corner of the icon. The default anchor position is the center of the cluster icon.

anchorText?: [number, number]

The position (in pixels) from the center of the cluster icon to where the text label is to be centered and drawn. The format is [yoffset, xoffset] where yoffset increases as you go down from center and xoffset increases to the right of center. The default is [0, 0].

markerclustererplus样式不会居中

Markerclustrerplus style will not center

javascript

google-maps

markerclusterer