Cambiar el color del texto en innerHTML según el valor en GeoJSON.
Cuando me posiciono sobre diferentes condados en mi mapa, un div se actualiza si el condado votó republicano o demócrata en las elecciones del 2020 (entre otras cosas). Dirá si votó republicano o demócrata en una etiqueta <h2>
.
Tengo una columna en el GeoJSON que tiene códigos hexadecimales rojos o azul dependiendo de la mayoría de votos del condado. ¿Cómo puedo extraer el valor de esa columna en el GeoJSON para cambiar el color del texto que se muestra en el div?
Aquí hay una captura de pantalla del div
Quiero hacer que el color del texto de la etiqueta <h2>
(en el caso de este condado “Demócrata”) corresponda al valor de elecVaxData_voteColor
. ¿Cómo puedo hacer esto?
Gracias de antemano y háganme saber si se necesita más información.
Aquí está el código
davy.ai
Para cambiar el color del texto que se muestra en la etiqueta
h2
para que corresponda con el valorelecVaxData_voteColor
en GeoJSON, puedes utilizar JavaScript para establecer dinámicamente el estilo de la etiqueta. En la funcióninfoCounties.update
, reemplaza la etiqueta<h2>
por la siguiente:Esto concatenará el valor de cadena de
props.elecVaxData_voteColor
con la propiedad CSScolor:
y lo establecerá como estilo inline para la etiquetah2
. Esto cambiará el color del texto para que coincida con el valor de color en la columna del GeoJSON.