topic Re: How to rubberband zoom w/o the shift key: arcgis api for javascript in ArcGIS JavaScript Maps SDK Questions

How to rubberband zoom w/o the shift key: arcgis api for javascript

Town_ofSnowflake — Wed, 11 Sep 2013 22:29:30 GMT

I want to enable the rubberband zoom effect without users having to hold the shift key down. This behavior is found is Esri navigation bar dijit. I don't want to use the dijit.

How can I get a zoom in/out bounding box to draw without forcing users to use shift key?

Re: How to rubberband zoom w/o the shift key: arcgis api for javascript

JasonZou — Thu, 12 Sep 2013 12:39:08 GMT

I am confused. By default, zoom in/out function does not require to work with SHIFT key. Here is an sample.

Re: How to rubberband zoom w/o the shift key: arcgis api for javascript

Town_ofSnowflake — Sat, 11 Dec 2021 06:40:04 GMT

Yes. You are correct. I misread the docs.

Solution:
The zoom in/out is handled by the navigation class. This includes the ability to draw a rubberband box. You can design your own toolbar, you just need the navigation object in your code.

Add to the top of js:

dojo.require("esri.toolbars.navigation");
var navToolbar;

Add to the init function:

navToolbar = new esri.toolbars.Navigation(map);

Create a listener for the button of your choice, and include this:

navToolbar = new esri.toolbars.Navigation(map);

Re: How to rubberband zoom w/o the shift key: arcgis api for javascript

JasonZou — Thu, 12 Sep 2013 13:40:22 GMT

No need to create navToolbar more than once. Once it's created, just use navToolbar.activate to activate its operation. Here is a sample code.

function activateNavigation(navType) {     if (navType) {         navToolbar.activate(navType);          // for some reason, when switch ZoomIn to ZoomOut or vice versa, the pan operation is enabled.         // I believe it is a bug. Here is a workaround.         if (navType !== "pan" && map.isPan) {             map.disablePan();         }          // set map cursor based on the navigation type         switch (navType) {         case esri.toolbars.Navigation.PAN:             map.setMapCursor("move");             break;         case esri.toolbars.Navigation.ZOOM_IN:         case esri.toolbars.Navigation.ZOOM_OUT:             map.setMapCursor("crosshair");             break;         default:             map.setMapCursor("default");             break;         }     } }

Re: How to rubberband zoom w/o the shift key: arcgis api for javascript

Town_ofSnowflake — Thu, 12 Sep 2013 13:45:22 GMT

Got it. Thanks!

Re: How to rubberband zoom w/o the shift key: arcgis api for javascript

JasonZou — Thu, 12 Sep 2013 14:27:06 GMT

You are welcome, Melo. Please consider to mark this thread as "Answered" so it may be helpful for others. Thanks.