Tom Bird Tom Bird - 1 month ago 10
AngularJS Question

Datamaps is giving me a Cannot read property 'albersUsa' of undefined

I'm getting this error when try to create a map:

Datamaps error
I'm currently using version

"datamaps": "^0.5.8",
this is directly from my
package.json
. I also checked the
package.json
in the actual package to see where main was pointing:

Datamaps package.json <code>main</code> parameter
I found a related issue, maybe even the same issue here:

https://github.com/markmarkoh/datamaps/issues/259

Problem is that no one ever said what the answer was, one person mentioned that only a specific country js file was being loaded but I checked and
datamaps.all.js
is being loaded.

Answer

This is to be attributed to the new modularity of D3 v4, which made it necessary to flatten namespaces:

However, there is one unavoidable consequence of adopting ES6 modules: every symbol in D3 4.0 now shares a flat namespace rather than the nested one of D3 3.x.

For your code this means that some references using the d3-geo module are invalid because they refer to properties which are no longer available in v4:

Geographies (d3-geo)

Because datamaps has defined a dependency on D3 like ^3.5.6 this will include D3 v4. However, because of the above mentioned changes in the namespace you will have to use a D3 v3 instead.