This is the P2PU Archive. If you want the current site, go to www.p2pu.org!

Online Maps with OpenLayers

Maps for Coloring and Highlighting Countries - Chat 24 Feb

Nick Doiron's picture
Mon, 2011-02-28 04:33

Our chat last Thursday focused on mapping and highlighting individual countries.  There are a lot of different options here, especially if you have data or like charts.

The place to go is definitely ThematicMapping.org.  Check this out http://thematicmapping.org/playground/openlayers_choropleth_geojson.php

How do they do that?  For that particular example, it's two parts.  Follow the JavaScript link underneath the map on that page.

Notice these lines: 

vectors = new OpenLayers.Layer.GML( "Internet users", "../data/json/internet_users_2005_choropleth_lowres.json",
                                        { format: OpenLayers.Format.GeoJSON,

The link in quotes is this data in GeoJSON format, which includes the outlines of each country, and sets a value and color for each:
http://thematicmapping.org/data/json/internet_users_2005_choropleth_lowres.json

A similar system is used to map each country with a pie chart.  Look at the JavaScript and Data links there.
http://thematicmapping.org/playground/openlayers_piecharts_geojson_google_chart.php

I found this website by searching on StackOverflow - http://stackoverflow.com/questions/1892742/openlayers-vector-layer

Comments

Thanks for this. Being very

Mita Williams's picture
Mita Williams
Tue, 2011-03-01 00:16

Thanks for this. Being very interested how to add Open Data to maps, I downloaded this set of shape files from my city's data catalogue and translated the data into KML files using Geoconverter. I then tried to follow the convention from this example of using KML sets and OpenLayers, but my resulting code doesn't work: http://jsfiddle.net/copystar/wjHLr/1/

Is there something fundamentally wrong with what I'm doing, or is it just because I still don't have a firm grasp of Javascript syntax?

Hi Mita, It looks like

Nick Doiron's picture
Nick Doiron
Fri, 2011-03-04 03:18

Hi Mita,

It looks like OpenLayers expects the webpage and the KML file to be on the same website. You'd need another system, such as jQuery, to use jsFiddle to load from another website.

I'd suggest downloading http://jsfiddle.net/copystar/wjHLr/1/show/ to the same location as your KML file

Mita, Your map inspired me. I

intro vert's picture
intro vert
Fri, 2011-03-04 03:55

Mita,
Your map inspired me. I used personal sites of interest. How do I make the map image larger?
http://jsfiddle.net/introvert/yPCrG/3/