# OpenLayers.Control.PanZoom

The PanZoom is a visible control, composed of a OpenLayers.Control.PanPanel and a OpenLayers.Control.ZoomPanel. By default it is drawn in the upper left corner of the map.

#### Inherits from

- OpenLayers.Control

Summary

OpenLayers.Control.PanZoom | The PanZoom is a visible control, composed of a OpenLayers.Control.PanPanel and a OpenLayers.Control.ZoomPanel.
Properties |
slideFactor | {Integer} Number of pixels by which we’ll pan the map in any direction on clicking the arrow buttons.
slideRatio | {Number} The fraction of map width/height by which we’ll pan the map on clicking the arrow buttons.
buttons | {Array(DOMElement)} Array of Button Divs
position | {OpenLayers.Pixel}
Constructor |
OpenLayers.Control.PanZoom |
Functions |
destroy |
setMap |
draw |
_addButton |
_removeButton |
removeButtons |
onButtonClick |
getSlideFactor |
Constants |
X | {Integer}
Y | {Integer}

### Properties

### slideFactor

{Integer} Number of pixels by which we’ll pan the map in any direction on clicking the arrow buttons. If you want to pan by some ratio of the map dimensions, use slideRatio instead.

### slideRatio

{Number} The fraction of map width/height by which we’ll pan the map on clicking the arrow buttons. Default is null. If set, will override slideFactor. E.g. if slideRatio is .5, then the Pan Up button will pan up half the map height.

### buttons

{Array(DOMElement)} Array of Button Divs

### position

{OpenLayers.Pixel}

### Constructor

### OpenLayers.Control.PanZoom

#### Parameters

options | {Object}

### Functions

### destroy

> destroy: function()

### setMap

> setMap: function( | map | )

#### Properties

map | {OpenLayers.Map}

### draw

> draw: function( | px | )

#### Parameters

px | {OpenLayers.Pixel}

#### Returns

{DOMElement} A reference to the container div for the PanZoom control.

### _addButton

> _addButton:function( | id,
> | img,
> | xy,
> | sz | )

#### Parameters

id | {String}
img | {String}
xy | {OpenLayers.Pixel}
sz | {OpenLayers.Size}

#### Returns

{DOMElement} A Div (an alphaImageDiv, to be precise) that contains the image of the button, and has all the proper event handlers set.

### _removeButton

> _removeButton: function( | btn | )

#### Parameters

btn | {Object}

### removeButtons

> removeButtons: function()

### onButtonClick

> onButtonClick: function( | evt | )

#### Parameters

evt | {Event}

### getSlideFactor

> getSlideFactor: function( | dim | )

#### Parameters

dim | {String} “w” or “h” (for width or height).

#### Returns

{Number} The slide factor for panning in the requested direction.

### Constants

### X

{Integer}

### Y

{Integer}

The PanPanel is visible control for panning the map North, South, East or West in small steps.
The ZoomPanel control is a compact collecton of 3 zoom controls: a OpenLayers.Control.ZoomIn, a OpenLayers.Control.ZoomToMaxExtent, and a OpenLayers.Control.ZoomOut.
This class represents a screen coordinate, in x and y coordinates

> destroy: function()

> setMap: function( | map | )

> draw: function( | px | )

> _addButton:function( | id,
> | img,
> | xy,
> | sz | )

> _removeButton: function( | btn | )

> removeButtons: function()

> onButtonClick: function( | evt | )

> getSlideFactor: function( | dim | )

Controls affect the display or behavior of the map.
{Number} The fraction of map width/height by which we’ll pan the map on clicking the arrow buttons.
{Integer} Number of pixels by which we’ll pan the map in any direction on clicking the arrow buttons.
Instances of OpenLayers.Map are interactive maps embedded in a web page.
Instances of this class represent a width/height pair
Close