javascriptd3.jsdatamaps

Dynamically updating datamaps fill color not working using variable as country key

I'm having weird problems with updateCloropleth function. I followed this example :

https://github.com/markmarkoh/datamaps/releases/tag/v0.2.2

Here is an example of my problem. When I do this:

map.updateChoropleth({
    "AFG": colorx
});

The color updates. However, when I do this:

var countryx = "AFG";
map.updateChoropleth({
    countryx: colorx
});

It doesn't work.

I've checked that countryx == "AFG" returns true, so it's definitely the same value. The variable colorx can be passed fine, but passing the variable countryx as a key seems to break the function.

Any ideas how or why this is happening?

Solution

  • You can try this:

    var colorx = 100;
var countryx = "AFG";
var countryColor = {};

countryColor["AFG"] = colorx;

map.updateChoropleth(countryColor);

    See this thread - basically your problem stems from the fact that these two statements are the same:

    var obj = {"countryx": colorx}
var obj = {countryx: colorx}