Question

2

jvectormap region colors

rated 0 times [ 8] [ 6] / answers: 1 / hits: 17023 / 12 Years ago, fri, october 12, 2012, 12:00:00

Im using the jvectormap plugin, and I am trying to set the colors of each of the regions on the map. However, after applying the code below the map is displayed but with no colours applied. It just shows the map in white.

I have read multiple examples and questions on this matter, but I cant seem to get it to work for me.

Example 1 of setting random colours on a map.

Documentation

Similar question to mine, however it doesn't solve my problem.

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'

      }]

    }

});

Can anyone see the problem?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

alejandro

Add To Favorites

Follow

Total Points: 231

Total Questions: 102

Total Answers: 107

Location: Jordan

Member since Wed, Jun 17, 2020

4 Years ago

alejandro questions

1 Discord.js v13 code breaks when upgrading to v14

Mon, Jul 18, 22, 00:00, 2 Years ago

1 React Image Magnifiers not working when zoom in using nextjs

Fri, Sep 18, 20, 00:00, 4 Years ago

1 Discord.js bot responds when mentioned

Thu, Sep 10, 20, 00:00, 4 Years ago

1 how to get input field value on button click in Vuejs or in vanila javascript?

Sun, Aug 9, 20, 00:00, 4 Years ago

1 How do I set a user's voice channel when I have the user's id?

Thu, May 21, 20, 00:00, 4 Years ago

View All

answered 12 Years ago marinalyssak · Accepted Answer

Here is a working sample of what I think you're attempting to do.

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);

})();

This example builds off of two examples on the jvectormap site:

1. http://jvectormap.com/maps/countries/australia/

2. http://jvectormap.com/examples/random-colors/

The fiddle includes the jvectormap 1.1 file from the site. Also note the Random Colors example on the site uses jvm.WorldMap.