Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Animate borders changing over time in Leaflet and D3. Based on one of my earliest JS maps, http://maptonomy.appspot.com/mapdefault
JavaScript
Branch: gh-pages

Fetching latest commit…

Cannot retrieve the latest commit at this time

Failed to load latest commit information.
scripts
stylesheets
.gitignore
README.md
content0.geojson
content1.geojson
content10.geojson
content11.geojson
content2.geojson
content3.geojson
content4.geojson
content5.geojson
content6.geojson
content7.geojson
content8.geojson
content9.geojson
d3.html
d3.v3.min.js
leaflet.html
leafletp2.html
leafletstar.html
leafletstarp2.html
paths.png
queue.v1.min.js
transition.png

README.md

SomaliMap

Working toward a JavaScript library to animate changing borders: See Sample

Border lines 'flow' to their new locations, through their polygon boundaries, using a wayfinding algorithm for games called A* (A Star).

To transition from the map on the left to the one on the right, there are three changes:

  • A light blue region from the left map disappears

  • The orange-red region shrinks away from the coast

  • The purple region expands toward the coast (replacing the orange-red and blue regions)

The disappearing region is dissolved into its center. The other regions are reprojected onto an 80x80 grid for processing by the A* algorithm. The suggested path is returned as an array of grid squares, which can be reprojected as a path of latitude / longitude coordinates.

Here is a map showing the paths taken by moving points. They are somewhat blocky because they follow a grid:

Working on Leaflet.js library first, then D3

A* in JavaScript

The JavaScript implementation of A* is written by Brian Grinstead. See his blog post.

I heard about A* from Tesca Fitzgerald's talk at the 2011 Google Science Fair.

License

Somalimap is available under an open source MIT License

It is based on maps of the 2006-2007 conflict in Somalia which were uploaded to Wikipedia and put into the public domain

Something went wrong with that request. Please try again.