llamapope/geopuzzle

GeoPuzzle

This game tests your geography skills by let you dragging and matching each polygon against the correct position on the map. Inspired on Luke Mahe's hack on GMaps draggable polygons.

DEMO

Swiss cantons

USA/World Geography

Requirements

a webserver(i.e. Apache)

Setup

clone / download the project to a location that can be accessible via your webserver
access the project in your browser (i.e. http://localhost/geopuzzle/ )

Customize the game for your area

Grab a GeoJSON file for your area of interest. Not sure how to get/make one ? Contact me and I will try to help you.

Edit the config: static/map.js - app_config variable

  geojson_feeds: {
      Cantons: 'geojson/G3K12.geojson'
  },
  area_mask_fusion_tables_query: null,
  styles: {
      polygon_draggable: {
          strokeColor: "#FF0000",
          strokeOpacity: 0.8,
          strokeWeight: 2,
          fillColor: "#FF0000",
          fillOpacity: 0.1
      },
      polygon_final: {
          strokeColor: '#347C17',
          fillColor: '#347C2C',
          fillOpacity: 0.8
      }
  }

geojson_feeds: Local paths for the GeoJSON files containing the polygons
styles: PolygonOptions objects for the entities that are draggable / fixed
area_mask_fusion_tables_query: FusionTablesQuery object representing a mask polygon that highlights the area of interest.

Example for Switzerland boundaries mask
```
  {
  	select: 'geometry',
  	from: '812706',
  	where: 'id = 1'
  }
```
If set to null, no mask will be displayed

What's next ?

make a version with Districts of Switzerland, beta-testers are welcomed !
your idea ?

Stay in touch

Just contact me if you are not a programmer and / or need help in building a similar game for your region/country.

llamapope / geopuzzle