Mapbox GL JS 更改默认标记的颜色

Mapbox GL JS Change the color from the default marker

我开始失去理智了。

根据 Mapbox API,我应该能够更改默认标记颜色,但我没有在文档中找到任何不使用自定义标记的示例,而且最有可能的语法不起作用。

我正在使用mapbox-gl-js/v0.44.2

var marker = new mapboxgl.Marker({ "color": "#b40219" })
                .setLngLat([0, 0])
                .addTo(map);

使用此代码,地图显示时没有标记,如果我删除颜色选项,标记会正确显示但颜色错误。

对我搞砸的地方有什么建议吗?

在使用默认 Marker SVG 元素时支持自定义颜色自 v0.45.0 起可用,您正在使用 v0.44.2

发行说明:

https://github.com/mapbox/mapbox-gl-js/releases

如果您需要即时更改默认标记的颜色,您可以使用这种函数(使用 jQuery 获取元素的子元素):

function setMarkerColor(marker, color) {
    var $elem = jQuery(marker.getElement());
    $elem.find('svg g[fill="' + marker._color + '"]').attr('fill', color);
    marker._color = color;
}

螺丝jQuery

setMarkerColor(marker, color) {
      let markerElement = marker.getElement();
      markerElement
        .querySelectorAll('svg g[fill="' + marker._color + '"]')[0]
        .setAttribute("fill", color);
      marker._color = color;
    },
marker = new mapboxgl.Marker({
        color: $parameters.UpdatedMarkerColor,
        draggable: false
    });

设置marker时,把颜色放在括号里:

new mapboxgl.Marker({ "color": "#b40219" }) //this changes color to a dark red// .setLngLat([-74.5, 40]) .addTo(map);