Cómo cambiar el color de la fuente de una barra de escala de Esri

Question

Estoy trabajando en mi primer proyecto de mapa web de ESRI. En la página Default.Aspx la barra de escala se inicia como se muestra a continuación :

dojo.require("esri.dijit.Scalebar");
map.on('load', function () {
     //resize the map when the browser resizes
     var scalebar = new esri.dijit.Scalebar({ map: map, scalebarUnit: 'english' });
}

Lo que produce la barra de escala como se muestra a continuación :

¿Cómo puedo cambiar el color gris por defecto de la barra a rojo?

Salida de la consola :

Estoy utilizando la API de ArcGIS para JavaScript versión 3.x.

Answer 1

Puede utilizar las clases css denominadas esriScalebarRuler y esriScalebarRulerBlock

No puedo encontrar un ejemplo de regla para ver las propiedades css disponibles en estas clases, pero si haces clic con el botón derecho del ratón en la barra de escala y la inspeccionas en la consola, busca los estilos de borde para ponerlos en rojo, como:

.esriScalebarLabel
{
   color:red !important;
}

.esriScalebarRuler { 
   border: 2px solid #ff0000;
}

.esriScalebarRulerBlock {
    background-color: red;
}

referencia: https://developers.arcgis.com/javascript/jsapi/scalebar-amd.html