consolidating a switcher to mapbox.js
Specific questions follow this background:
Having ducked the question numerous times, I've finally gotten down to building a script that will serve as a multi-layer framework for future projects: A basic layer switcher for mapbox.js that uses "one-at-a-time" layer logic for more than 2 layer options, swapping out interaction and easing parameters fluidly. The DC Properties template is still the best example of this I've seen, despite valiant efforts by Tom and by WNYC.
Unfortunately the DC properties template is what seems to be the last of the pre-mapbox.js sites. It still functions on the old libraries (wax, MM, easey, etc), but is written without the smooth module syntax of mapbox.js. As such, I set out to update the code despite my sad-sack javascript knowledge.
The first step was okay: I stripped out all the extraneous CSS and HTML, then compiled the javascript and removed some of the "abstracted abstraction" of the original template. I reremoved the calls to the old libraries and styles (wax et al.) and replaced them with mapbox.js and mapbox.css calls in this example. This "works" to render and switch, but it hangs on tenterhooks for everything else; adding UI elements or interaction via the mapbox.js syntax breaks the site at every turn.
This is because the core of the site - site.js - is calling to
back-compatible functions like wax.tilejson and
MM.map, which don't have the new syntax available to
them. So I ran through site.js, replacing every "old" function with
its mapbox.js equivalent. Predictably, the site now grinds to a halt after
loading the layer buttons. Specifically, it's a warren of
uncaught reference and type errors, and I'm not sure they're the
heart of the problem anyway. I think I've got two items here, with
corresponding questions:
-
Is there an equivalent to
map.setOverlayin mapbox.js? Lines 52-84 here are the core of the "Add a layer on the existing base" functionality, and I can't seem to find an equivalent to it - or towax.mm.connector- in the new API. -
What is the best place to position
mapbox.mapamidst all the ajax of this script? It's currently at line 18 of the script, and this worked fine when it was being called asMM.map. Now I think its late arrival has a hand in the typeError that gets thrown on line 10, as well as the failure to bind UI elements.
I know this is a potential gordian knot, but this core capability is essential for two projects I'm currently working through. Thanks as always for the great building blocks!
Comments are currently closed for this discussion. You can start a new one.
Support Staff 2 Posted by Will White on 06 Dec, 2012 09:40 PM
Maybe the solution would be to start fresh and fix the layer switcher example. Would that work?
3 Posted by wboykinm on 07 Dec, 2012 03:30 AM
Probably; honestly it was sort of nice to have all the tilejson , DOM id and easing parameters called in a list, but anything would work at this point. I noticed that John Keefe figured out how to do this for two layers alone but the way it's written doesn't allow the logic to be easily extended to 3+ layers.
4 Posted by wboykinm on 25 Mar, 2013 06:04 PM
By the way, this one is long-since figured out, so you can close it up.
Tom MacWright closed this discussion on 25 Mar, 2013 06:05 PM.
System closed this discussion on 06 May, 2013 06:11 PM.