Creating a "Points of Interest" map with open source tools

autarky-magazine
project-digital-medenine

#1

Content

1. Introduction

2. Using the POI map

3. Managing and contributing to the POI map

4. Contributing to OpenStreetMap


1. Introduction

Initial writeup by @matthias, but this is a wiki: welcome to contribute!

Creating an own, digital Points of Interests map and providing it to everyone else online can be really useful for a community – community in the widest sense, from groups of nomadic travellers to long-established city neighborhoods:

  • The map helps individuals to remember locations, restaurants and shops that they visit only rarely.

  • The map creates and spreads collaboratively created knowledge about recommendable local shops and amenities.

  • The map introduces visitors to the local economy so that they are not restricted to buying from the big shops that tourists often consider “safe options”. This, in turn, also supports the local economy against the “big players”, esp. because in most developing economies the small shops are actually cheaper than the big stores.

  • It is a simple form to bring small shops into the digital age: they do not have to create an online shop, instead providing a business name, opening hours, a phone number and a short description will be enough.

  • Beyond mapping shops and amenities, such maps can also be useful for many other types of “points of interest”:

    • foraging (wild fruit trees, herbs, mushrooms, other natural resources like bamboo and stones etc.)
    • reducing food waste (unused fruit trees on private property that people allow the public to use etc.)
    • mapping local pollution for trash cleanup days
    • disaster mapping of damage by flood, earthquakes, storms, wildfires etc.
    • crisis response mapping (people and what they need)

The following is a way to create such a map. So far, it is an (incomplete) introduction to OsmAnd~ and uMap. OsmAnd~ is the best open source map software for Android, and uMap is a free web-based service for collaboratively creating custom maps online. It is completely open source software and uses free map data from OpenStreetMap. As an alternative to uMap, you might also like to try FacilMap – a very similar tool, also based on OpenStreetMap.

In the following instructions, we use our “Essaouira POIs” uMap as an example, which we developed during the OpenVillage House Sidi Kaouki project. You should of course create your own map and apply the instructions accordingly.

2. Using the POI map

2.1. Using the POI map in a browser

  1. Simply open our uMap in your browser, either on a desktop computer or on a mobile device.
  2. When you open the map initially, a search panel is available on the right-hand side. Type anything there and a search over all names of our POI map markers will be made.
  3. If you close that panel and want to get it back later, you can find it by clicking the “Map Layers” icon in the left side column of icons, and then the “Browse data” button there.

2.2. Using the POI map offline

This is useful when travelling, as you don’t know if you have a working data connection at all times. It works with all Android devices.

  1. Install the “open source app store” F-Droid on your Android phone or tablet. There is a nice video with installation instructions.
  2. Install the OsmAnd~ application from F-Droid by searching for “OsmAnd” inside the F-Droid app.
  3. In the app, download the world base layer map and the map for the local area.
  4. Open our uMap in your mobile device, click the “Share” icon on the left side.
  5. Choose “Download data → gpx”, click “Download data” and save the file in the “Downloads” folder.
  6. Switch to OsmAnd~ and go to “main menu → My Places”.
  7. Click “+” in the lower left corner, select “Open from → Downloads”, and select the GPX file from uMap that you just saved. It will be imported into a new “My Places” category.
  8. If you went through this process before, you can now hide or delete any categories in “My Places” containing previous versions of that GPX file. All that data is still contained in the newest version you just imported.
  9. Use the “Search” icon in “main menu → My Places” in OsmAnd~ to find something in our POI map, or just tap on the map markers in your vicinity to see what is around.

3. Managing and contributing to the POI map

3.1. Creating the POI map

Here is how to initially set up your own uMap map. Here we use the gratis web service umap.openstreetmap.fr; but uMap is open source software, so if you are determined enough you can also host it on your own server. For small, public mapping projects there is not much reason to do so. (Just always keep a backup of your data – see chapter 3.4. below – so you can transition to a self-hosted installation in case the free web service might go away in the future.)

  1. Use Firefox as a browser. (There seems to be a bug in Chrome making it hang when changing map security settings. Adding markers to the map etc. is however possible without problems in any browser.)

  2. Create an OpenStreetMap account and log in: https://www.openstreetmap.org/login

  3. Visit the English uMap website and create a map.

  4. On the right top, click “Edit Map”, then click the “Change tilelayers” icon that appears, and choose “OpenStreetMap” there to get rid of the French placenames.

  5. Click the key icon (“Update permissions and editors”) and configure the map to be editable by everyone with the link. (That’s the part where Chrome hangs, and even Firefox may take a while. But it works.)

  6. Zoom and move the map to focus on the affected area, then click the “Save this center and zoom” icon in the right column.

  7. Save the map.

  8. Copy the map’s URL (“the link”) from your browser’s address bar.

  9. Optional: Modify your map’s URL to make it as short as possible for simple sharing. You can omit the last part looking like #9/28.0465/83.2324, and you can replace the title part appearing before the map ID with any sequence of character to shorten it. Your URL would then look very similar to mine, just with a different ID: http://umap.openstreetmap.fr/en/map/id_162690 Do not forget to try your shortened URL before handing it out!

  10. Open an incognito window in your browser and visit your map’s URL. Try if you can add a marker successfully without logging in. (The incognito window makes sure you appear to the website as not logged in, even though you may be logged in to the map in another browser window.)

  11. Share the map link around to whoever should see or edit it.

3.2. Collecting and contributing POI data with the browser

This is the most comfortable solution, esp. for adding one or a few points. But obviously it does not work without Internet access (proper mobile network reception, booked Internet package).

  1. Simply open our uMap in your browser, either on a desktop computer or on a mobile device.
  2. Click the “Enable Editing” icon in the top right.
  3. Click the “Draw a marker” icon in the top right and draw a marker on your map.
  4. In the “Select the layer of the feature” dropdown, select the appropriate topic: Medical, Transport, Commercial (shops, restaurants), Money (ATMs, banks and currency exchange) or Misc (for the “other stuff”). This automatically assigns the marker color as well.
  5. Enter a name and description. The name should contain everything people might use to search this POI, as the description field is not searchable.
  6. Click “Shape properties → Icon symbol → define” and select an appropriate white icon.
  7. Click “Save” in the top right and wait for the confirmation message.
  8. When you are done with your editing session, click “Disable editing”.

3.3. Collecting POI data offline, contributing it with the browser

This is preferable when for adding POIs in areas without proper mobile network coverage for Internet access, and also when you use the OsmAnd~ app anyway for navigation and don’t want to switch to the browser app to add another POI.

  1. This solution uses the same app “OsmAnd~” as in the “Using the POI map offline” instructions from above, so if you have not yet, install the OsmAnd~ application from F-Droid on your Android device and in the app, download the world base layer map and the Morocco map.
  2. Walk around and when you see a POI that is not yet on our map, long-press the screen in OsmAnd~ at the point’s location and create a “favourite” marker. Put everything into the title that might be relevant for people searching this, as both in uMap and OsmAnd~ the search only covers the name, not the description. Put supplementary information like shop opening times into the description.
  3. Save that favourite into a category like “Essaouira POIs 1”, using the next free number.
  4. After some days when you mapped enough and want to put your points on the share map, rename your category to “Essaouira POIs 1 (in uMap)”.
  5. In “main menu → My Places”, go to the three-dots menu of the category to export and click “Share → Save as …”. Save it in the “Downloads” folder or similar.
  6. Open our uMap on your mobile device, and click the top-right pencil button to edit the map.
  7. Click the :arrow_up: icon to import data and select the GPX file you just saved. For the layer to import it to, select one named “by @username” (using your Edgeryders username). Everyone has their own layer for their own data, which protects against accidental deletion / overwriting etc…
  8. Finalizing your contributed POI data by editing it in a browser. Basically open every POI for editing once, and go along the steps under “Contributing POI data to the map in a browser” to set layer, name, description and symbol according to our conventions in this map.

3.4. Creating a backup of the uMap data

Doing this regularly, esp. after you made sizable edits, protects against data loss by troll activity. Because after all, we have set the map to be publicly editable.

  1. Click on the “Layers” icon (left side, bottom icon) and make all layers visible. Because a data download will only include currently visible data items.
  2. Click on the “Share and embed this map” icon.
  3. Make sure “Full map data” is selected as download type, and click “Download data”.

3.5. Publishing your POI map online

Since it’s using the umap.openstreetmap.fr webservice, your POI map is already online and you only have to share the link. However, there are also ways how to customize it further by embedding it into your own website, and adding pages with information to your website that are linked from the POI points on the map.

[TODO]

4. Contributing to OpenStreetMap

While you explore the area and add points of interest, you will also encounter cases where the map itself is inaccurate or incomplete. Fortunately, it is OpenStreetMap, so you can edit it.

Below is a simple process how to efficiently collect this data alongside the Points of Interest so you can contribute it to OpenStreetMap later. We do not cover here how to contribute it to OpenStreetMap: that’s a bit technnical but has good documentation.

4.1. Contributing point data to OpenStreetMap

This covers the steps of getting point-like data into uMap that are meant for adding them later to OpenStreetMap: POIs, start and end of ways, geolocated user notes meant to help you editing OpenStreetMap later. Actually editing this data into OpenStreetMap is a whole other process not covered in this wiki.

In short, just follow the process “Contributing POI data to the map offline” from above, just that you put the POIs into a favourite category “OSM Additions” in OsmAnd~ and import them into a new layer “@username OSM Additions” in uMap.

4.2. Contributing GPX tracks to OpenStreetMap

This covers the steps of getting GPX data into uMap. Getting it from there into OpenStreetMap is a whole other process not covered in this wiki.

  1. In the OsmAnd~ app, download and install the GPX logging plugin.
  2. Configure the screen so that the GPX logging button appears in the top right corner.
  3. Click the button to start logging a section.
  4. Click the button again to stop logging a section (the idea is to only log ways that are not on OpenStreetMap yet, avoiding a lot of point editing for splitting them later).
  5. Add a “favourite” marker in OsmAnd~ to the start of a section to record information about it for adding it properly to OpenStreetMap later. Put that favourite into a special category “OSM additions” or similar.
  6. When you finished your mapping session, click the GPX button again and click “Save current track”.
  7. Open the uMap for example our uMap) in Chrome on Android, and go into editing mode.
  8. Click the “:arrow_up:” icon to import data, select your GPX track, and select a layer “by @username (OSM Additions)” as target layer. Be sure to not select “Replace layer contents”.

Crisis mapping with open source tools: The case of the 2017 monsoon floods in Nepal
Twenty-Seven New Business Ideas for the Southern Mediterranean Region
OpenVillage House Sidi Kaouki Manual
#2

@yosser and @zmorda, here is the wiki I promised to write with the proposed tools and usage conventions for the Digital Medenine project. It won’t be perfect yet, so ideally try it out first and give me feedback where to refine the instructions with screenshots etc… Happy mapmaking!


#3

Nice writeup.

If you have general POI’s that are interesting to other people you could consider adding them to transformap too

http://transformap.co/about/

http://www.solidarityeconomy.eu/susy-map/

https://discourse.transformap.co/t/which-transformap-web-services-exist/1226