Where communities thrive

  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
Repo info
Hello, I'm using angular-datamaps, hoping someone has experience with that. I am basically trying to change the fillKey of a country, using data["DEU"].fillKey = "MEDIUM". Without zoom that works perfectly, but when I zoom in and change the fillKey the map zooms out on redraw, which is what I'd like to prevent. Is it possible to maintain the projection while redrawing or to get the current projection in my controller to use it in the setProjection function? Any help would be appreciated!
Hello, is there a dynamic way to scale the scope of the maps based on the countries in the array?
Hi, does anyone know if there is a possibility to make bubbles clickable? I want to be able to click on a bubble which leads to another url.
Aidis Stukas
Is it possible to resize country on hover?
Aidis Stukas
Hi, I would like extra information to appear on hover. How can I do that?

Im working on a project for charities world wide. I got an question from one of my clients:

The country South Sudan is on the world map with a Sudan. But South Sudan has been independent since 2011. Is there an opportunity to separate South Sudan from Sudan?

Is it possible to edit or update the maps?

@aidiss if you add an object in data and then configure the popupTemplate: function(geography, data) {
if ( data ) {
return '<div class="hoverinfo" style="max-width: 300px"><strong>' + geography.properties.name + '</strong> <br />' + data.object_name+ ' </div>'
for the 'extra information' in hover
Hi guys..
Is there any way to display a specific state and then a city on the onclick functionality in Datamaps ?
Sean Bennett
@markmarkoh: Is there anything holding up this PR that fixes map hover on Edge? It's a pretty quick fix for a relatively significant issue. Tested it locally and confirmed that it resolves the problem. https://github.com/markmarkoh/datamaps/pull/367/files
Ilya Nesterov
Hi folks, I need a little help with datamaps/d3.geo. I want to have rotating map with datapins. So far I created this http://jsbin.com/sularijimi/edit?html,output , but here is a problem I have points array which represents points I want to show on a map, but this array is dynamically extended. To simulate it I have setInterval routine. The problem I have is when points is dynamically extendable, somehow "d" attribute which contains pass is missing. If I initialize points array ones, it works fine.
Is there anything I do wrong? I guess might be datamap.svg.selectAll('.point').attr("d", datamap.path); is incorrect way, but it does work fine if points is not dynamically changed. Should I have some method that delete all existing points before adding them? But I feel that would be a huge overhead?
@markmarkoh might be you have some ideas? I also have a few patches to supply to a datamap to make rotation and zoom of the map easier and
would be good if anyone can help me with this.
i am rendering data in datamaps
i want to use a custom worldmap ( with like a great cool design )
is there any predevelop custom map designs which i can take a look at.
i just want worldmap with different looks.
Hi, I am trying to create a bubble map. I used the datamaps template to create a simple map but I am not sure how to add bubbles to this one. Can anyone help me out?
Screen Shot 2017-11-07 at 12.31.10 PM.png
Hi guys, is it somehow possible to put links on bubbles?
Hamilton Lima
hey there
can I help somehow to have the latest version from Git available on NPM?
after I download 0.5.8 using npm install I realized that is not matching the latest version on git
Zoom not working properly it kind Zooming and pan towards left Am I doing anything wrong ?
done: function (datamap) {
datamap.svg.call(d3.zoom().scaleExtent([1, 10]).on("zoom", function () {
datamap.svg.attr("transform", 'translate(' + d3.event.transform.x + ') scale(' + d3.event.transform.k + ')')
Leonard Seffer
Hey, how would I go about increasing performance of datamaps? I have a lot of bubbles on my map that I want to update like every second. Using the fading-bubbles plugin. It's lagging quite a lot when rendering 1000+ bubbles at a time. Is there some easy way to integrate webgl or something else for better performance?
Abhinit Parelkar

Thanks a lot for sharing the code, Mark.

For some reason I'm not able to render the zoom functionality. When I used the code provided on under the toggle menu, I received two errors:

  1. color not defined - when I removed the color code, I received the following:
    1.1 TypeError: a not defined under maps.hires.js

Could anyone please help me out?

Jie Cai
hi! I'm wondering if the map.updateChoropleth() function supports with updating dataURL. currently I have to plug in the data manually! thanks
Mohammad Amin Najafi
how to use angular cli?
do you plan to release a new version? I'm a little afraid that datamaps is unmaintained
Alvaro Paniagua
how can i click on a state and redirect to a URL?
Hi, can I edit geographical boundaries of a country?
I want to edit boundaries like:
instead of this:
Please note that the top part of the country boundaries are different . First image is correct. Please help.
Hi guiz
Can anyone tell me how to get the map of russia?
I can't find nowhere how to display a map of a single country that isn't usa
shubham rajput
Hi All I need help
Is it possible to get country level zoom from world level map and load states of country
instead of loading countries seperately
How to get a bigger map?
Anyone have any good examples of a map of the US's counties working? I haven't had much luck getting one to display
I'm working on a rotating map and want to switch to a low-res map while rotating, but when I use a remote dataUrl, the geographyt dissapears when the map is being redrawn... any ideas how to solve this?
Meir Mukushev
Hi! How to use it with Vue (not vue-datamaps)
is missing from map can any body else noticed ? also can we put ?
Jorge Pietrogiovanna
Hey guys, I am looking to make a function that when the user clicks on a state, they will be redirected to a anchor/section of another page. I've tried using the "done" method that comes with the package but I am not able to access the data attributes as seen in the "geographyConfig" method.
I circled the first instance of "data.related" because that will show in the map. The second "data.related" in the link interpolated wont work. I would like to set up a static link and depending on which state the user clicks on they will be taken to a different slug.
Hi, This is my first post. Could anyone take a look at https://stackoverflow.com/questions/67895125/adding-bar-chart-to-datamaps-using-d3-js