Button for zoom box

Question

I've developed a beta map that overlays wilderness boundaries on top of satellite, locational, and topo basemaps. I'm providing multiple ways for users to zoom into wilderness areas. They can obviously use the zoom scroller, double-click, or use the zoom dropdown boxes at the top, which I've programmed to zoom to the extent of whatever is selected. So if a user selects a wilderness, the map will zoom to the extent of that area. My beta testers, however, have said that the state dropdown is ineffective since it works well for some states that don't have too many wilderness areas or are small in size, but results in an overwhelming view for large states or those that have lots of wilderness areas (contrast selecting Vermont with selecting California, for example). So I've decided to eliminate the state dropdown and replace it with a zoom box button (probably a magnifying glass or something similar). When the user clicks on this button, I want it to result in a one-time zoom via the zoom box. So when the user clicks the button then clicks and drags on the map, they will draw a zoom box rather than pan. I know that users can do this as is, since I call map.enableRubberBandZoom, however, most people don't know this and it's not intuitive for my audience to remember to hold down Ctrl, then click and drag to draw a zoom box.

The functionality I'm looking for is similar to the ArcGIS Explorer on ArcGIS.com.

Unfortunately, while this seems like it should be pretty simple and a common task that map makers would want to do, I'm not finding anything in the way of examples. Any guidance would be appreciated!

khutchins · Answer

Here's a code snippet that uses the approach Steve mentions above. Basically you use the navigation class to zoom in when a user clicks the zoom button. Once the zoom in is complete you deactivate the navigation. Navigation toolbar

Zoom In

StephenLead · Answer

I really don't want the whole nav bar; I have my own nav bar which works for my application and just want to add this one function. Is there a way to do this without the nav bar? See the toolbar sample code page (sorry, I should have linked to this earlier) which shows the buttons inside Divs:

Zoom In I haven't tested this, but it should be possible remove the buttons you don't want, and/or put the Zoom In button on your existing Nav bar. Does that help? Cheers, Steve

LisaEidson · Answer

Hi Steve,
I had found some documentation on using the nav bar and digit buttons, and tried adding it, but I really don't want the whole nav bar; I have my own nav bar which works for my application and just want to add this one function. Is there a way to do this without the nav bar?