Customizable SVG map visualizations for the web in a single Javascript file using D3.js
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,
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?
for the 'extra information' in hover
@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
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.
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 + ')')
}));
}
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 + ')')
}));
}
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?
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:
- 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?
Please note that the top part of the country boundaries are different . First image is correct. Please help.
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
Is it possible to get country level zoom from world level map and load states of country
instead of loading countries seperately
Thanks
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