mapping with App Inventor Tutorial (V1)

This Tutorial shows Mapping with the Web viewer component using Open street maps and Google maps URLs, and with the canvas component using Google static maps and streetview APIs. (Version 2 of this tutorial adds mapping with the Start Activity component and with fusion tables. It also goes into more details regarding coordinate conversions, distance measurement, ...)

What you will learn :

  • What is a Web API (Application Programming Interface),
  • What is a URL (Uniform Resource Locator) and how to build it,
  • Mapping APIs on the web :Staticmaps and streetview APIs, open street map, Google maps, …
  • Display static maps with a Canvas component and interactive maps with webviewer and compare solutions,
  • Interact with a static map on canvas (drag to pan) and convert from pixel to geographic coordinates (degrees of latitude and longitude),
  • Plot markers,
  • Switch to streetview and walk inside monuments.

What you will do :

  • part 1 : display static maps with a Webviewer component
  • part 2 : display static maps with a Canvas component
  • part 3 (optional) : display interactive maps with the webviewer
  • part 4 (optional) : drag to pan map on the canvas map (interact from your app)
  • part 5 (optional) : add streetview display as a new map type
  • part 6 (optional) : display a list of markers on the map

Resources :

The main resources are the Tutorial is pdf format and the template App to get started with.
http://www.letustry.org/appinventor/apps/mapping/mappingTutorialV1/SanFran_startPart1.aia
http://www.letustry.org/appinventor/apps/mapping/mappingTutorialV1/SanFran_startPart1.apk

Please check for updates (documents or files)

Then you can do each step from the result of the previous step, or with the template App (.aia and .apk) for this step which you can load at the following addresses :
part 2 :
http://www.letustry.org/appinventor/apps/mapping/mappingTutorialV1/SanFran_startPart2.aia
http://www.letustry.org/appinventor/apps/mapping/mappingTutorialV1/SanFran_startPart2.apk
part 3 :
http://www.letustry.org/appinventor/apps/mapping/mappingTutorialV1/SanFran_startPart3.aia
http://www.letustry.org/appinventor/apps/mapping/mappingTutorialV1/SanFran_startPart3.apk
part 4 :
http://www.letustry.org/appinventor/apps/mapping/mappingTutorialV1/SanFran_startPart4.aia
http://www.letustry.org/appinventor/apps/mapping/mappingTutorialV1/SanFran_startPart4.apk
part 5 :
http://www.letustry.org/appinventor/apps/mapping/mappingTutorialV1/SanFran_startPart5.aia
http://www.letustry.org/appinventor/apps/mapping/mappingTutorialV1/SanFran_startPart5.apk
part 6 :
http://www.letustry.org/appinventor/apps/mapping/mappingTutorialV1/SanFran_startPart6.aia
http://www.letustry.org/appinventor/apps/mapping/mappingTutorialV1/SanFran_startPart6.apk