Quicklinks:
Open Source demonstration web maps (using Leaflet, JQueryUI):
Lost Rivers of Toronto – Disappearing Rivers – Timeline
Lost Rivers Ashbridge’s Bay Area Walks scrolling map tour (3 walks)
http://mercator.geog.utoronto.ca/georia/lostrivers/
ArcGIS Online demonstration web maps:
Lost Rivers of Toronto – Disappearing Rivers – Timeline App (2 versions)
CHGIS Lost Rivers – Ashbridges Bay Story Map (McMurrich 1882) App
http://hgisportal.esri.ca/portal/apps/MapAndAppGallery/index.html?appid=3272511933fa41498201836717b41a27

For detailed pilot project development documents see links at end of this article.

The Lost Rivers Walks project (http://lostrivers.ca/) takes people on guided walking tours around the city of Toronto “…to create an appreciation of the city’s intimate connection to its water systems by tracing the courses of forgotten streams, by learning about our natural and built heritage and by sharing this information with others.” They are one of the community partners of Geohistory-Géohistoire Canada. For many years they have been using historical cartographic and other archival sources, interviews with long-time residents, and on-the-ground encounters with the topographic peculiarities of the city to draw the map of Toronto’s drainage pattern as it must have been before the city-building process forced much of it underground.

With Helen Mills and John Wilson representing the Lost Rivers project, we decided to create web-maps for this pilot project on two different themes:
1. Disappearing Rivers of Toronto:  A map of the city of Toronto showing the original stream network of the city, and how those streams disappeared over time as they were buried for purposes of development.
2. Lost Rivers Ashbridge’s Bay Area Walks:  A series of interactive maps dynamically illustrating the stops along the way for three of the walks offered by Lost Rivers in this area of Toronto’s eastern waterfront, linking the locations of the stops, and pictures and text related to each, in a “map tour” format.
Links to all of the maps are embedded below.

As planned for this project, we designed and produced two different versions for each of these map themes:  one using the ArcGIS Online platform and another using Open Source software and web serving tools, in this case primarily the Leaflet and JQueryUI javascript libraries.

The ArcGIS ONLINE VERSIONS can be found on the Geohistory-Géohistoire Canada Development Portal (technically an ArcGIS Enterprise portal) hosted online by our partners at Esri Canada at: Lost Rivers of Toronto Apps Gallery. To view other Portal content go to: http://hgisportal.esri.ca/portal. The “Gallery” contains 3 apps. This is because there are two versions mounted of the Disappearing Rivers of Toronto app. One is hosted on the portal itself, using a “standard” timeline slider to turn the rivers off as they “disappear” over time. That timeline slider looks like this:

This version of the app was built using ArcGIS Online Web AppBuilder, which is a very user-friendly tool which allows authors of web maps to drag and drop user interface components like this standard “Time Slider” widget into their web app. The widget can even be configured specifically for one’s map and data, in limited ways, such as the icon that is used for the tool, and whether the time-specific layers are indicated above it.
For more info on the Web App Builder see: http://doc.arcgis.com/en/web-appbuilder/

However, more sophisticated customizations which may be desired, or even necessary, are not possible. For example, the slider has two “handles”, set at 1830 and 1840 in the picture above. Each one can slide forward or backward along the timeline independently, to select a “range” of data. This design is very appropriate for some applications – however when the goal is to illustrate a “snapshot” of the environment at a single point in time – like our “Disappearing Rivers” map – it can be confusing, and the resulting map may be unclear. A slider design offering only one handle to the user, identifying a single point in time, like the picture below, simplifies and clarifies the interface.

This customization was only made possible by hosting the app on an independent server (i.e. not on ArcGIS online itself, or the Geohistory Portal) and using the Developer Edition of the Web AppBuilder for ArcGIS (https://developers.arcgis.com/web-appbuilder/). This is a rather complicated process requiring the installation of the development app on a local computer, registration of the app on the Geohistory Portal so that portal-based web maps may be incorporated, development and testing of the app and customizations on the local computer, deploying the app on the independent server, and then registering the final app on the Geohistory Portal so that it is accessible there.

The OPEN SOURCE software versions of the Lost Rivers maps are being hosted on a server in the Department of Geography at University of Toronto.  The maps are incorporated into a single web page with top-bar links to the Disappearing Rivers map, and each of the Ashbridge area walks. They can be found here: http://mercator.geog.utoronto.ca/georia/lostrivers

In contrast to the ArcGIS Timeline slider, the Timeline slider used for the Disappearing Rivers map is one of a set of generic JQueryUI slider tools, adapted for the specific needs and time frame of our map. (http://jqueryui.com/slider/) The version we arrived at looks like this:

Working with generic Javascript tools has pros and cons. The advantages have to do with the transparency of the coding related to design. The JQueryUI API documentation is thorough and the techniques use fairly basic Javascript and CSS coding. We were able to adapt the tool and tweak the graphic design of it without much problem. The ArcGIS Web AppBuilder widgets, although fully available for customization, use a more complex design framework and the Dojo Toolkit (https://dojotoolkit.org/), so are not as accessible to less-than-expert programmers. And as described above, the system the ArcGIS templates are embedded within and the workflow required, is rather complicated. In comparison to customizing the ArcGIS Web AppBuilder App, the workflow involved in developing the Leaflet-based site was extremely simple. Documents could be written and tested on local drives, and uploaded to a web server when completed.

The disadvantage of working in the simpler generic environment is a reduction in functionality, what could be termed the native intelligence of the application. In this context, using GeoJSON for the Rivers overlay there is no concept of “time-aware” data. The line data is displayed based on a simple query of the integer field value, in this case the “Year last seen on map”. This worked fine for our year-based attribute data, but any more sophisticated queries based on chronology, or using a variety of time formats, could be very problematic to code, or at least more complicated to integrate into the interface.

There is not enough space here to go into the production of the Lost Rivers Ashbridge’s Bay Area Walks web maps, but a similar process occurred regarding ArcGIS Online and parallel Open Source development. For more detailed information about the work done on these pilot project web maps, we have mounted technical development documents on this site, linked below.  Also, for the Open Source coding we have posted the code used and some examples on GitHub. For further questions about the projects, please feel free to post comments and discussion below, or to contact the author at byron.moldofsky@gmail.com.

LINKS TO DOCUMENTATION

Lost Rivers Toronto “Disappearing Rivers” Map Open-Source Development Document

Lost Rivers Toronto “Disappearing Rivers” Map ArcGIS Online Development Document

Lost Rivers Toronto “Ashbridges Walks Maptour” Open-Source Development Document

Lost Rivers Toronto ” Ashbridges Walks Maptour ” ArcGIS Online Development Document

For the code for the Open Source site, see: Lost Rivers Toronto Github Open-Source Repository

This post is also available in: French