Yesterday, I discussed the method for us to access our Google Doc data. Today I am going to speak of what we call the “presentation layer.” This layer is the actual webpage that viewers see, the map that is on it, and the styling of the data that is viewable.
To show a map of the country, we again turned to Google, but not with the map most people are most familiar with. The traditional Google map that most people embed on their websites, while extremely powerful, has some small issues: it is not visually appealing, and it is overly complex unless you are, in fact, trying to find roads, waterways, or even need to zoom down to the street level. We didn’t need that. What we needed was something visually appealing, something clean, and most importantly something easy to use. Enter the Google GeoMap. If you use Google analytics, you will be familiar with this map. What it provides is a very clean interface. The user clicks on a state, and the API displays data for that state. If there’s no data in that state, it is shown in a color that lets the user know the “container is empty.”
Tomorrow, I will talk about this final step – how I integrated our map pages into the CSS style sheets. This way, if you integrate one of these maps into your own website, it will look like the application is an integrated part of your website, and not thrown in as an after thought.
Come back tomorrow when I talk about how to use CSS styling to integrate the map right into your website.
This post originally appeared on Grown In The City.