How do you make a tile map?

Best programming language to make a fill-in map?

  • How would I go about programming a map which would fill-in an area with color when a question was answered correctly? So, I know jack about programming. But I have a minor obsession with answering geography quizzes on sporacle. Their map-based questions are kind of for shit, though --- when you answer a question correctly, the corresponding country/state name appears on the map, but a lot of times when smaller countries are smooshed together, the result is a confusing mishmash. I've been looking for a similar type of quiz where, when questions are answered correctly, the area is colored in on the map, but I've been unable to find anything like that. It made me wonder how difficult it would be to make such a thing. It didn't seem like it would be ridiculously difficult, and I thought it might be an interesting opportunity to tinker around and teach myself something new. So, what kind of programming language would I have to teach myself to make such a thing?

  • Answer:

Diablevert at Ask.Metafilter.Com Visit the source

Was this solution helpful to you?

Other answers

The easiest thing is going to be using HTML and Javascript. Look for http://newsignature.github.io/us-map/ that have the maps you want.

jeb

Yeah, HTML/Javascript would probably be the easiest way to go, I've had good luck with http://leafletjs.com/examples/choropleth.html and also with https://www.mapbox.com/mapbox.js/example/v1.0.0/layers-control/ which is built on top of leaflet.

Static Vagabond

If you want to learn a language where quick visual results are important, I'd recommend http://processing.org/. It has libraries (http://simulacra.blogs.casa.ucl.ac.uk/2012/01/mapthing/, http://thomasdiewald.com/blog/?p=1382) which make reading https://en.wikipedia.org/wiki/Shapefiles simple.

scruss

Thanks for all the answers so far. I shall play around with these and come back.

Diablevert

D3 is amazing, and I'm currently really into it, but it is kinda in the deep end. A lot of experienced programmers struggle with it. That said, if you go through the above links and get what you want happening, that is awesome; problem solved. If they end up leaving too many gaps between A and B, so to speak, you might want to back up and learn about http://net.tutsplus.com/tutorials/javascript-ajax/the-best-way-to-learn-javascript/. However, reading general tutorials can seem horribly abstract and like it's not moving you toward a solution. So, another way to go about it is to think about the steps involved — 1. Find or draw SVG data for the geographic entities you want to show. (SVG is scalable vector graphics, like in Adobe Illustrator. Vector graphics let you zoom in on small, detailed shapes.) 2. Present those SVG elements in an <svg> element on a web page. 3. Respond to a click by changing the fill attribute of a specific SVG element (representing a geographic region). — and google techniques for doing each one. Then, go back to the tutorials when you think a technique explanation is assuming you know something you don't know. Then, you'll be reading to find out X or Y, and maybe it'll be easier to keep reading. I know that makes reading that kind of thing easier for me, personally.

ignignokt

I agree with ignignokt that D3 is "in the deep end," but you might want to at least look at this http://bl.ocks.org/mbostock/4060606.

callmejay

Just Added Q & A:

Find solution

For every problem there is a solution! Proved by Solucija.

  • Got an issue and looking for advice?

  • Ask Solucija to search every corner of the Web for help.

  • Get workable solutions and helpful tips in a moment.

Just ask Solucija about an issue you face and immediately get a list of ready solutions, answers and tips from other Internet users. We always provide the most suitable and complete answer to your question at the top, along with a few good alternatives below.