demo: http://www.stefanobovio.com/map-breaker/
demo with geoBonne projection: http://www.stefanobovio.com/map-breaker/?geoBonne
inputs
Akey move leftDkey move left
default values work for an image with width 1024px and height 512px that covers the global extension.
this GUI uses projections from following library:
country.geo.json data from https://github.com/johan/world.geo.json
propertyKeyproperty to display after it a featureleftKeyCodechange key code to move leftrightKeyCodechange key code to move right
var projection = 'geoBonne'; // or undefined for EPSG:4326
fetch('countries.geo.json')
.then(function (res) {
res.json()
.then(function (featureCollection) {
const mapBreaker = new MapBreaker(
'#map', // selector for div element
{
propertyKey: 'name',
leftKeyCode: 65,
rightKeyCode: 68
});
mapBreaker.wall(featureCollection, projection);
mapBreaker.loop();
});
});Work only with Polygon and MultiPolygon feature
npm install
npm start -> http://localhost:8085