Using custom control with Google Maps KeyDragZoom

Question

I am using KeyDragZoom

http://google-maps-utility-library-v3.googlecode.com/svn/tags/keydragzoom/2.0.5/docs/examples.html

I would like to put the control somewhere else on the page, not within the google map. I can not figure out how to do this. I would even be fine with having a button off the map that would just trigger a click of the button within the map. How can I activate the drag zoom?

P.S. I am using the Visual Drag Zoom Control instead of using a keyboard key like shift.

Answer 1

The accepted answer assumes that the zoom control is on the map. If visualEnabled is false, the dragzoom_btn image will not exist.

A hack that seems to work:

function onZoomClick() {
   var myKeyDragZoom = map.getDragZoomObject();
   myKeyDragZoom.hotKeyDown_ = !myKeyDragZoom.hotKeyDown_;
}

When clicked, the zoom mode is turned on. When clicked again or the rectangle is drawn, zoom mode is automatically turned off.

Answer 2

Ended up doing this $('img[src=http://maps.gstatic.com/mapfiles/ftr/controls/dragzoom_btn.png]').click();

Thanks hookedonwinter