Ability to show and hide layers in a map easily

[rmglennon]

During office hours in October, we had a user who was just starting to work with mapzen.js. He has a map that used Stamen raster tiles, along with a series of layers, like a basemap, roads, terrain, special points of interest, and so on. He had already built some JS for his previous web map to turn layers on and off with a checkbox. While we were watching, he switched to mapzen.js and our vector tiles.

Adding this here to make sure our tools can support and we have documented this kind of fundamental "map sandwich" workflow. This is basically like the hamburger menu on GMaps, where you can turn the satellite, traffic, and transit layers on and off with a switcher.

[dmvaldman]

This may be something that would require some re-jiggering of Tangram.js. What do you think @bcamper?

[bcamper]

@nvkelso and @sensescape have been refactoring the house styles so there are easy global properties in Tangram that can be used to toggle layer visibility. Bubble Wrap is furthest along here (and ready for this kind of functionality), and the other house styles should follow in Q4.

BTW there is some layer toggling in Tizen, but only for specific things like transit overlay (so some of these changes were made to support that project). You can see that in the Bubble Wrap demo by selecting transit layer "show" in the menu: http://tangrams.github.io/bubble-wrap/#15/37.7928/-122.3937

[migurski]

Does that mean that it’s currently possible-though-inconvenient, or would we need to wait for a new revision of the styles to be able to take advantage of this?

[bcamper]

I believe it's only possible in Bubble Wrap right now, because the other house styles still use the older YAML anchor/reference syntax, and those values can't be changed at run-time (they are just strings embedded in the YAML and get interpreted once at parse-time).

@nvkelso can provide guidance on when all styles should be switched to the new global syntax.

[migurski]

👍

[hanbyul-here]

Just to be clear, it was not specifically about toggling layers inside of vector tiles / or changing Tangram style. This person was using some raster tiles including satellite image, and (can't remember what it was but one kind of) selecting-layer-plugin was being used to switch tilelayers ( so tangram layer is just one of layer).

I will look into how people are switching tilelayer, and see current structure works with other existing controls. (loosely related issue: https://github.com/mapzen/mapzen.js/issues/284)

[rfriberg]

@hanbyul-here - it looks like this works with Leaflet's built-in Layers control. See example: https://bl.ocks.org/rfriberg/169ad43af27511c5bf4ef4f32a77d406

Also, see larger discussion I'm (slowly) pushing in #318

[hanbyul-here]

@rfriberg oh yeah. I was worried that TangramLayer is trying to draw over 2d or something, but I was wrong!