Following MapKnitter's shutdown in 2022 due to lack of funds, Public Lab's code community team came together to come up with a way to run some version of MapKnitter on minimal resources.
MapKnitter has been used by thousands of people to make their own aerial maps (a kind of DIY Google Earth), especially of areas of environmental disasters like the 2011 BP oil disaster. @publiclab community members take aerial photos from balloons, kites, & even long poles and combine or “knit” them into high resolution maps.
One reason MapKnitter went offline was its high cost to operate. So MapKnitter Lite re-imagined MapKnitter as a serverless, static JavaScript app that runs for free, hosted on GitHub Pages. We chose to build it within GitHub Pages, for now as a subset of the purely JS Leaflet.DistortableImage project.
Happily, due to the excellent work of @segun-codes and @7malikk during the 2023 Winter session of Outreachy, we have been able to make almost all of MapKnitter's original features available again.
But where are the images and saved maps stored? Images are kept in Internet Archive collections (which Public Lab was already doing) & maps are saved in “mapknitter.json” save files, which can be downloaded, emailed, or stored online.
In addition, since we made a huge effort to archive over 7800 old MapKnitter maps at @waybackmachine, @7malikk & @segun-codes made it possible to open and edit old maps. It’s not the fanciest, but here’s a list of all ~7800 maps:
https://publiclab.github.io/Leaflet.DistortableImage/examples/mapknitter
Now, for some documentation:
save file
: a JSON file containing a saved state of the images you've added to the map, their positions and distortionsIA
: Internet Archive
You can perform perspectival distortion of map images to build new maps over the provided background map tiles.
- Start the server with
http-server
(install this withnpm install http-server
) and load https://localhost:8080/examples/archive.html in your browser. Or visit https://publiclab.github.io/Leaflet.DistortableImage/examples/archive to use the GitHub Pages version online. - Follow instruction in the dialog box displayed to fetch images to work with. (They must first be uploaded into an IA collection.)
- Click the "Place on map" button on the opened sidebar to place the desired image on the base map.
- Begin distorting and knitting of the images on the base map to build new map as desired.
You can download a "save file" of your current map to your computer after completing your mapknitter task or if you intend to continue working on the same map. With the download feature, the current state of your map (image positions, but not the image files themselves) is saved in the save file. The save file can be used to restore you map in the future so that you can continue knitting your map from the point where you stopped, or share it with someone else.
- After knitting the map, click the stack icon to open the sidebar.
- Click the download button.
- An save file is generated and downloaded to your computer.
- The save file can be used to reconstruct the map in the future.
MapKnitter Lite offers the ability to save maps to the browser for easy retrieval in the future. Remember: it is only saved in your current browser, not on other devices or in other browsers on the same device. This feature uses the browser's localStorage
capability.
- After knitting the map, click the stack icon to open the sidebar.
- Click the save icon.
- An save file is generated and saved to your broswer.
- The save file can be used to reconstruct the map in the future.
You can share your map by sharing the downloaded save file or by uploading the save file to IA or another publicly available online URL.
- Follow the instruction on section "Download Map".
- Upload the save file to archive.org.
- Alternatively, you can share the save file by email to another recipient (e.g., a colleague).
MapKnitter Lite now supports reconstruction of maps from save files uploaded into archive.org collections.
- Construct shareable URL using one of the two URL formats below: a. Using the full URL of a JSON file: https://publiclab.github.io/Leaflet.DistortableImage/examples/archive?json=https://archive.org/download/mkl-2-2/mkl-2-2.json b. Using just the key of the IA collection, where it will auto-detect the JSON file: https://publiclab.github.io/Leaflet.DistortableImage/examples/archive?k=mkl-2-2 c. We also wanted to enable people to load old maps from the MapKnitter.org website. To load a legacy map like https://mapknitter.org/maps/ceres--2 (now offline, but cached in the Wayback Machine), you can use the URL https://publiclab.github.io/Leaflet.DistortableImage/examples/archive?kl=ceres--2
- Share or save the above URLs
- Load the shareable URL in a browser to reconstruct the map.
- Names of all legacy save files are available here: http://localhost:8081/examples/mapknitter.html
- Legacy save file with image objects having no coordinates are downloaded and placed on the sidebar, not the tile layer.
A user can reconstruct map by dragging and dropping a save file onto the base map.
- Load URL https://publiclab.github.io/Leaflet.DistortableImage/examples/archive or https://publiclab.github.io/Leaflet.DistortableImage/examples/local in your browser.
- Close dialog box if any is displayed. At this point, the tile layer is cleared.
- Drag and drop the save file onto the tile layer.
- This restores your map to its previous state and you can continue further knitting tasks.
MapKnitter Lite can now detect a save file containing, and upon user confirmation, it is loaded onto the base map.
- Load URL https://publiclab.github.io/Leaflet.DistortableImage/examples/archive
- Follow instruction in the dialog box displayed to fetch images to work with, from an IA collection with a save file in the collection.
- A pop-up will ask if you want to restore map from save file, if one is detected in the IA collection entered in the dialog box.
- Click "Ok" to restore the map using the detected save file.