Friday, March 14, 2008
Posted on Friday, March 14, 2008 5:08:47 PM (Mountain Daylight Time, UTC-06:00)  Comments [2] | 
Categories: Dojo | Virtual Earth

I needed to add a slider type zoom control into Virtual Earth, and since my project is already waist deep in Dojo, it only seemed fitting that I figure out how to use their slider control.

The Dojo framework is an open source client side javascript framework with some pretty nice UI components. You can see the slider here in the Book of Dojo.

Turns out that this is pretty simple to do:

  1. Create the Dojo Slider in markup
  2. After loading Virtual Earth, use map.AddControl, passing in the slider element
  3. Wire up a handler that updates the slider when the map zoom changes
  4. Wire up a handler that updates the map when the slider changes
  5. Sip beer and congratulate your self on a job well done.

Actually the only difficult thing here was divining how to get the slider value - the Book of Dojo is a great general starting point, and the API is too sparse to help out much. There is a Dojo Feature Explorer site that helps though.ve-dojo-slider

You can see a live demo here: http://www.davebouwman.net/examples/vedojoslider.htm

Download the html page

Assuming anyone finds this sort of stuff useful (comment!), I'll post more of these simplified examples using Dojo and YUI with VE.

Friday, March 14, 2008 6:34:08 PM (Mountain Daylight Time, UTC-06:00)
Great stuff. I like the Dojo slider with labels - it fits a project I'm doing. I assume your doing this because VE took the regular slider away (I guess figuring everyone is using the mouse wheel).
Tim Maddle
Friday, March 14, 2008 8:55:10 PM (Mountain Daylight Time, UTC-06:00)

Dave:

Keep the tips coming. There can never be too many recipes in the cookbook given the many potential uses of JavaScript apis.

Brian
Comments are closed.