Actualmente tengo un marcador circular que crea círculos de color rojo para las instancias en mal estado.
Ahora, en este mismo mapa mundial, también deseo tener círculos de color verde para las instancias sanas .
Para dar un ejemplo, el nombre de la ciudad "Phoenix" puede tener 20 instancias no saludables y 3 instancias saludables. Entonces, en este caso, me gustaría tener un círculo de color ROJO para las instancias en mal estado y un círculo de color verde para las instancias saludables de Phoenix.
{ CityMapData.map((city, index) => { const { unhealthyInstancesCount, healthyInstancesCount, entityName, totalInstancesCount, timeZoneData, } = city; return ( <CircleMarker key={index} center={timeZoneData.coordinates} radius={10 * Math.log(unhealthyInstancesCount+ 1)} fillOpacity={0.5} stroke={false} color={COLORS.RED} > ); }) }Simplemente elija el color dependiendo de una condición y pase unhealthyInstancesCount y healthyInstancesCount como instanciasCount a este componente donde lo necesite
const { instancesCount entityName, totalInstancesCount, timeZoneData, isHealthy } = city; return ( <CircleMarker key={index} center={timeZoneData.coordinates} radius={10 * Math.log(instancesCount+ 1)} fillOpacity={0.5} stroke={false} color={isHealthy ? COLORS.GREEN : COLORS.RED} >