Javascript 如何在Google Maps api上更新或强制重画标记群集图标？

我创建了一个自定义集群html标记，在这个标记中，我从集群中更改标记的颜色。 调试代码时，变量颜色已更新，但我的标记颜色未更新

我创建了一个函数updateMakers，我调用它来更新集群

我调用这个函数来更新集群标记

 document.getElementById('update').addEventListener('click', function(){

 updateMarkers(locations, markers, HTMLMarker, map, 'green');
})

但是颜色不会更新

函数initMap（）{
var map=new google.maps.map（document.getElementById（“map”）{
缩放：12，
中心：{
拉脱维亚：37.773972，
液化天然气：-122.431297
},
手势处理：“贪婪”，
disableDefaultUI:true
});
var标记=[]；
变量位置=[{
拉脱维亚：37.77，
液化天然气：-122.44，
},
{
拉脱维亚：37.78，
液化天然气：-122.45，
},
{
拉脱维亚：37.79，
液化天然气：-122.42，
},
{
拉脱维亚：37.72，
液化天然气：-122.43，
},
{
拉脱维亚：37.74，
液化天然气：-122.42，
},
{
拉脱维亚：37.75，
液化天然气：-122.41，
},
{
拉脱维亚：37.75，
液化天然气：-122.43，
},
{
拉脱维亚：37.79，
液化天然气：-122.43，
},
{
拉脱维亚：37.78，
液化天然气：-122.43，
}
];  
变量Newlocations=[
{拉丁美洲：-31.563910，液化天然气：147.154312}，
{拉脱维亚：-33.718234，液化天然气：150.363181}，
{拉丁美洲：-33.727111，液化天然气：150.371124}，
{拉丁美洲：-33.848588，液化天然气：151.209834}，
{拉丁美洲：-33.851702，液化天然气：151.216968}，
{拉丁美洲：-34.671264，液化天然气：150.863657}，
{拉丁美洲：-35.304724，液化天然气：148.662905}，
{拉丁美洲：-36.817685，液化天然气：175.699196}，
{拉丁美洲：-36.828611，液化天然气：175.790222}，
{拉脱维亚：-37.750000，液化天然气：145.116667}，
{拉丁美洲：-37.759859，液化天然气：145.128708}，
{拉丁美洲：-37.765015，液化天然气：145.133858}，
{拉丁美洲：-37.770104，液化天然气：145.143299}，
{拉丁美洲：-37.773700，液化天然气：145.145187}，
{拉丁美洲：-37.774785，液化天然气：145.137978}，
{lat:-37.819616，lng:144.968119}，
{拉丁美洲：-38.330766，液化天然气：144.695692}，
{拉丁美洲：-39.927193，液化天然气：175.053218}，
{拉丁美洲：-41.330162，液化天然气：174.865694}，
{拉丁美洲：-42.734358，液化天然气：147.439506}，
{拉丁美洲：-42.734358，液化天然气：147.501315}，
{拉丁美洲：-42.735258，液化天然气：147.438000}，
{拉丁美洲：-43.999792，液化天然气：170.463352}
]
更新标记（位置、标记、HTMLMarker、地图“红色”）；
document.getElementById（'update'）.addEventListener（'click'，function（）{
更新标记（位置、标记、HTMLMarker、地图“绿色”）；
})
函数更新标记（数据、标记、HTMLMarker、地图、背景）{
var labels=“abcdefghijklmnopqrstuvxyz”；
var infoWin=new google.maps.InfoWindow（）；
markers=data.map（函数（位置，i）{
var htmlMarker=新的htmlMarker（location.lat、location.lng、bg）；
google.maps.event.addListener（htmlMarker，'click'，函数（evt）{
console.log（“htmlMarker click@”+evt.latLng.toulvalue（6））；
infoWin.setContent（“打开我的信息窗口
标记”+i）；
infoWin.setOptions({
pixelOffset:new google.maps.Size（20,0）
})
infoWin.open（地图、htmlMarker）；
});
返回htmlMarker；
});
var markerCluster=新的MarkerClusterer（地图、标记、{
图像路径：“https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m"
});
}
}
google.maps.event.addDomListener（窗口'load'，initMap）；
var HTMLMAKER=功能（纬度、液化天然气、bg）{
this.lat=lat；
这是液化天然气=液化天然气；
this.pos=新的google.maps.LatLng（lat，lng）；
this.bg=bg；
}
HTMLMarker.prototype=新的google.maps.OverlayView（）；
HTMLMarker.prototype.onRemove=函数（）{
if（this.div&&this.div.parentNode&&this.div.parentNode.removeChild）
this.div.parentNode.removeChild（this.div）；
}
HTMLMarker.prototype.getDragable=function（）{}；
HTMLMarker.prototype.getPosition=函数（）{
把这个还给我
};
HTMLMarker.prototype.onAdd=函数（）{
this.div=document.createElement（'div'）；
this.div.className=“htmlMarker”；
this.div.style.position='absolute'；
this.div.style.cursor='pointer'；
console.log（this.bg）；
this.div.innerHTML=`
$500
`；
var=这个；
this.div.addEventListener（“单击”），函数（evt）{
控制台日志（“单击”）；
google.maps.event.trigger（即“单击”{
拉廷：那个
})
})
var panes=this.getPanes（）；
panes.overlayImage.appendChild（this.div）；
}
HTMLMarker.prototype.draw=函数（）{
var overlyprojection=this.getProjection（）；
var position=从LatlngToDivPixel（this.pos）的过度投影；
var panes=this.getPanes（）；
this.div.style.left=position.x+'px'；
this.div.style.top=position.y+'px'；
}

正文{
保证金：0；
填充：0；
字体：12px无衬线；
}
h1，p{
保证金：0；
填充：0；
}

更新标记https://stackoverflow.com/questions/ask#

我的错误我需要设置一个超时来解决我的问题

setTimeout(() => {
           updateMarkers(locations, markers, HTMLMarker, map, 'green');
      }, 300);

---

你的红色标志在旧金山。你的绿色标记在新西兰。红色标记永远不会被删除（因为没有代码可以删除它们）对不起，我的错误对不起，我的错误，我只想更新标记的颜色在我的html标记中我正在使用SVG，我正在更改SVG的颜色，但是我的SVG颜色没有更改。我在你的HTMLMarker代码中没有看到任何SVG。

${this.bg}

在我看来不正确。如果要更改现有标记的颜色，则必须修改HTMLMarker代码。很抱歉，我发现了问题，是超时问题。我的数据较大，需要设置超时以更新群集颜色。