---
title: "ZoomRectangleNavigator Class"
canonical: https://www.graphicsmill.com/docs/gmwc/T_J_GraphicsMill_ZoomRectangleNavigator.htm
archived: true
applies_to:
  - product: "Graphics Mill Web Controls"
---

**You’re viewing documentation for an outdated product.** Graphics Mill Web Controls is no longer part of Graphics Mill. For current design editing and rendering tools, see [Design Atoms .NET](https://customerscanvas.com/docs/on-premises/design-atoms-cs/), [Design Atoms JS](https://customerscanvas.com/docs/on-premises/design-atoms-js/), and [Design Editor](https://customerscanvas.com/docs/on-premises/design-editor/).

# ZoomRectangleNavigator Class

**Applies to:** Graphics Mill Web Controls · **Archived documentation**
 
This client-side class corresponds to the [ZoomRectangleNavigator](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_ZoomRectangleNavigator.htm.md) server-side control.
 
**Namespace:** [GraphicsMill](https://www.graphicsmill.com/docs/gmwc/N_J_GraphicsMill.htm.md)
 **Assembly:** Aurigma.GraphicsMill.AjaxControls (in Aurigma.GraphicsMill.AjaxControls.dll)
 
## Syntax
  
```
GraphicsMill.ZoomRectangleNavigator = function();

Type.createClass('GraphicsMill.ZoomRectangleNavigator',GraphicsMill.RectangleController);
```
 
## Remarks
  
This class represents a navigator which is used to zoom the content displayed in the [BaseViewer](https://www.graphicsmill.com/docs/gmwc/T_J_GraphicsMill_BaseViewer.htm.md) control by selecting necessary portion of the content by the mouse.
 
When this navigator is attached to the [BaseViewer](https://www.graphicsmill.com/docs/gmwc/T_J_GraphicsMill_BaseViewer.htm.md), it is working in the following way:
 
1. When the left button of the mouse is pressed down, it captures the mouse control.
2. When control is captured and the mouse is moved, the selection rectangle is displayed and stretched.
3. When the left button of the mouse is released, the control zooms the content so that the selected portion occupies as much control client area as aspect ratio allows.

You can attach this navigator from client-side code using the [BaseViewer.navigator](https://www.graphicsmill.com/docs/gmwc/P_J_GraphicsMill_BaseViewer_navigator.htm.md) property.
 
## Inheritance Hierarchy
  
- Sys..Component
    - *+* Sys.UI..Control
        - *+* [GraphicsMill..UserInputController](https://www.graphicsmill.com/docs/gmwc/T_J_GraphicsMill_UserInputController.htm.md)
            - *+* [GraphicsMill..RectangleController](https://www.graphicsmill.com/docs/gmwc/T_J_GraphicsMill_RectangleController.htm.md)
                - *+* GraphicsMill..ZoomRectangleNavigator
   
## See Also

### Reference

- [ZoomRectangleNavigator Members](https://www.graphicsmill.com/docs/gmwc/AllMembers_T_J_GraphicsMill_ZoomRectangleNavigator.htm.md)
- [GraphicsMill Namespace](https://www.graphicsmill.com/docs/gmwc/N_J_GraphicsMill.htm.md)
- [Aurigma.GraphicsMill.AjaxControls..ZoomRectangleNavigator](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_ZoomRectangleNavigator.htm.md)
