Sheltowee Trace trail with mile markers and landuse background image. First draft.
As we update the Sheltowee Trace maps, I took a diversion and looked at Tilemill from the folks at MapBox to create an interactive online map of the new alignment. Tilemill is pretty awesome app and allows you create a projects using a variety of spatial data, including Shapefiles, GeoTIFFs and GeoJSON (a new format to me, but shows some interesting possibilities).
The strength of Tilemill centers on few features; you can style layers in markup very similar to CSS, attribute data can be used for styling and interactively shown on the published map, attributes and features can be displayed differently at different zoom levels, and you publish to an MBtile file, a SQlite database. This format contains many thousands, no millions, of raster tiles that are served quite fast in your browser. In my opinion, a ton of creativity can be found in this free app.
For the Sheltowee Trace map, I pulled in a GeoTIFF of landuse with elevation hillshading, the ST trail with mile markers, and polygons of county and larger towns. After tinkering with the style sheets, I made a fairly simple map. I wanted to add so many more layers, but I had to see how it looked online. The simplest way to publish it to use MapBox’s service, but the .mbtiles file was 300 MB and I wanted to host on SheltoweeTrace.com. I needed to to use a few javascript libraries to serve this map on our server. I chose Leaflet through MapBox’s Wax library (inspired by this post) and it was fairly easy to setup. One thing I learned after a little frustration, the newest version of Leaflet.js will not work with the .js files in Wax. Use only the files included in Wax and it will work perfectly. The only other bit of code needed is something to read the data in the mbtiles file and format it properly for Wax. I used tileserver.php and it is important link if you want to display attribute data interactively.
While the map is very simple, it has some potential I think. Obviously the base map needs finishing with a good legend, but some exciting options include adding popup photos of significant trail features (with the future hope make this an interactive submission for users) and using Leaflet’s geolocation feature for mobile devices (pretty buggy now and there’s issue of offlining the data for use in the field).
Leave a Reply