7 ms·
Ask HN: Are there any JavaScript libraries for generating maps?
Specifically, I'd love to be able to pass in geocoded location boundaries and color styles to generate a map of the chosen color over the chosen area. Google maps is obviously great for showing navigational data or directions, but I'm thinking along the lines of something more graphic.
Does anyone have any thoughts along these lines?
- mdhgriffiths 12y agoGoogle Maps API does have [some limited] style options, however then you're stuck using Google Maps API. There is even a "wizard" to make things easier: http://gmaps-samples-v3.googlecode.com/svn/trunk/styledmaps/wizard/index.html http://gmaps-samples-v3.googlecode.com/svn/trunk/styledmaps/... Mapbox is a great alternative for stylish maps. Their JS library is built off of Leaflet which allows you to change the tileset at a later date.
- kaybe 12y agoMight not fit your criteria, but in the scientific community GMT is popular: http://gmt.soest.hawaii.edu/ http://gmt.soest.hawaii.edu/
- eloycoto 12y agoYou can use cartodb. It's a service but it's faster than use libraries like leafletjs http://cartodb.com/ http://cartodb.com/ Regards.
- thrwy10 12y agoYou might be looking for Mapbox and/or Leaflet https://www.mapbox.com/developers/ https://www.mapbox.com/developers/ http://leafletjs.com/ http://leafletjs.com/
- rkda 12y agoCan you post an example of what you want? If you just want to produce choropleths, you can try Leaflet. Other options include d3.js and kartograph. http://kartograph.org/ http://kartograph.org/ http://d3js.org/ http://d3js.org/
- onion2k 12y agoYou can style maps using https://www.mapbox.com/ https://www.mapbox.com/ and embed them very easily using leaflet.js. If you want to go a bit further, stamen mapstack does some cool stuff: http://mapstack.stamen.com/ http://mapstack.stamen.com/
- chishaku 12y agoThis can help you get up and running quickly: http://jvectormap.com/ http://jvectormap.com/
- mbostock 12y agoHere’s my introductory tutorial for creating a map with D3 & TopoJSON using geometry from Natural Earth: http://bost.ocks.org/mike/map/ http://bost.ocks.org/mike/map/ And here’s a subsequent tutorial for visualizing geographic data: http://bost.ocks.org/mike/bubble-map/ http://bost.ocks.org/mike/bubble-map/
- xfalcox 12y agoI'm currently using D3 & TopoJSON to plot many things (including where our visitors are, since we have the lat and long of our users, by parsing the nginx log) and it's really great!! Thanks for your hard work Mike!!!
- pp19dd 12y agoJust thought I'd say, when I first ran into D3, I sneered a bit. "These guys are just copying protovis." Took me a bit longer to notice the connection.
- adrice727 12y agoAnother D3 tutorial that was helpful: http://www.tnoda.com/blog/2013-12-07 http://www.tnoda.com/blog/2013-12-07
- dpeck 12y agoCan you clarify on "more graphic"? I'm a fan of datamaps, https://datamaps.github.io/ https://datamaps.github.io/, for doing some quick and getting decent output.
- azov 12y agoIf you want to create your own map tiles in advance and show them using JavaScript library - use TileMill [1] and Leaflet [2]. Both are excellent and very well documented. To create the whole map on the fly using JavaScript - try mapbox-gl.js [3]. You should be able to pass your location boundaries via mapboxgl.GeoJSONSource (and then you probably don't even need MapBox API key - haven't tried it, though) and style it like this: https://www.mapbox.com/mapbox-gl-styles/styles/bright-v4.json https://www.mapbox.com/mapbox-gl-styles/styles/bright-v4.jso... PS. If you decide to host your own tiles - remember that browsers limit the number of connections to each domain. Your map will load much faster if you serve tiles from several different domains, e.g. tiles1.example.com, tiles2.example.com, etc. [1] TileMill - https://www.mapbox.com/tilemill/ https://www.mapbox.com/tilemill/ [2] Leaflet - http://leafletjs.com/ http://leafletjs.com/ [3] MapboxGL - https://www.mapbox.com/mapbox-gl/ https://www.mapbox.com/mapbox-gl/
- jeroenvisser101 12y agoIf someone is going to use different domains for their tiles, they might want to do something with hashes of the tile id/name to get a subdomain, in order to preserve caching.
- cinjon 12y agoLightning by mathisonian is a solid library for generating these in python/js. It's an http-based data viz server with additional functionality similar to iPython notebooks. Check out the map demo on the github here: https://github.com/mathisonian/lightning https://github.com/mathisonian/lightning
- bni 12y agohttp://geo5.org http://geo5.org
- jaybo_nomad 12y agoBleeding edge WebGL requirements, but great 3D object control: http://cesiumjs.org/ http://cesiumjs.org/
- CoreSet 12y agoThanks all for the responses! I have a lot of new tech to try out. For those wanting an example: http://kut.org/term/google-fiber http://kut.org/term/google-fiber Basically just a grey/white map showing important navigational details like roads and rivers, with different color sections overlaying it.
- chippy 12y agoSo, what did you use? How did you do it? Did we help?
- hackertoolbox 12y agoGreat discussion. Tools are in the box now. http://www.hackertoolbox.com/tags/map http://www.hackertoolbox.com/tags/map