jvectormap región colores

Im utilizando el jvectormap plugin, y estoy tratando de establecer los colores de cada una de las regiones en el mapa. Sin embargo, después de aplicar el código a continuación, se muestra el mapa, pero sin colores aplicados. Simplemente muestra el mapa en blanco.jvectormap región colores

He leído múltiples ejemplos y preguntas sobre este tema, pero parece que no puedo hacer que funcione para mí.

Example 1 de configuración de colores aleatorios en un mapa.

Documentation

Similar question a la mía, sin embargo, no resuelve mi problema.

jQuery('#mapDiv').vectorMap({ 
    map: 'au_merc_en', 
    backgroundColor: 'none', 
    colors: { 
     AU-SA: '#4E7387', 
     AU-WA:'#333333', 
     AU-VIC:'#89AFBF', 
     AU-TAS:'#817F8E', 
     AU-QLD:'#344B5E', 
     AU-NSW:'#344B5E', 
     AU-ACT:'#344B5E', 
     AU-NT:'#344B5E' 

    }, 
    series: { 
     regions: 
     [{ 
     attribute: 'fill' 
     }] 
    } 
});

¿Alguien puede ver el problema?

Fuente

2012-10-12 Navigatron

Aquí hay una muestra de trabajo de lo que creo que está intentando hacer.

http://jsfiddle.net/3xZ28/34/

(function() { 
    var myCustomColors = { 
     'AU-SA': '#4E7387', 
     'AU-WA': '#333333', 
     'AU-VIC': '#89AFBF', 
     'AU-TAS': '#817F8E', 
     'AU-QLD': '#344B5E', 
     'AU-NSW': '#344B5E', 
     'AU-ACT': '#344B5E', 
     'AU-NT': '#344B5E' 
    }; 

    map = new jvm.WorldMap({ 
     map: 'au_merc_en', 
     container: $('#ausie'), 
     backgroundColor: '#eff7ff', 
     series: { 
      regions: [{ 
       attribute: 'fill' 
      }] 
     } 
    }); 

    map.series.regions[0].setValues(myCustomColors); 
})();

Este ejemplo se basa fuera de los dos ejemplos en el sitio jvectormap:
1. http://jvectormap.com/maps/countries/australia/
2. http://jvectormap.com/examples/random-colors/

El violín incluye el archivo jvectormap 1.1 desde el sitio. También tenga en cuenta que el ejemplo de colores aleatorios en el sitio usa jvm. WorldMap.

Fuente

2012-10-13 00:57:48 mg1075

Gracias! Esto es exactamente lo que necesitaba hacer. Tu ejemplo muestra que funciona de todos modos. Sin embargo, no está funcionando con mi código. Invoco el script usando '.getScript()' que contiene este código en la función 'document.ready()' y no aparece nada en la pantalla. Debo estar equivocado en otro lugar, o debe haber un problema llamándolo. Usando Firebug, puedo ver que el script se llama de todos modos. Y el mapa se mostró de antemano, usando el mismo código. – Navigatron

Lo he reparado ahora, este código no funciona en 'document.ready()' usando solo la función que hizo el trabajo! – Navigatron

jsfiddle link ahora está muerto. –

El código siguiente ha sido editado para corregir los errores de sintaxis en el código publicado.

jQuery('#mapDiv').vectorMap({ 
    map: 'au_merc_en', 
    backgroundColor: 'none', 
    colors:{ 
     "AU-SA": '#4E7387', 
     "AU-WA":'#333333', 
     "AU-VIC":'#89AFBF', 
     "AU-TAS":'#817F8E', 
     "AU-QLD":'#344B5E', 
     "AU-NSW":'#344B5E', 
     "AU-ACT":'#344B5E', 
     "AU-NT":'#344B5E' 

    }, 
    series: { 
     regions: 
     [{ 
     attribute: 'fill' 
     }] 
    } 
});

Sin consolidar (antónimo más cerca de encapsulado que pueda reunir) guiones dentro claves de objeto causan un error de sintaxis. El error en sí es para una etiqueta no válida.

Fuente

2012-10-13 00:37:22 CBusBus

Respuesta

Cuestiones relacionadas