Protected
disposedThe object has already been disposed.
Padding (in css pixels).
If the map viewport is partially covered with other content (overlays) along
its edges, this setting allows to shift the center of the viewport away from that
content. The order of the values in the array is top, right, bottom, left.
The default is no padding, which is equivalent to [0, 0, 0, 0]
.
Animate the view. The view's center, zoom (or resolution), and rotation can be animated for smooth transitions between view states. For example, to animate the view to a new zoom level:
view.animate({zoom: view.getZoom() + 1});
By default, the animation lasts one second and uses in-and-out easing. You
can customize this behavior by including duration
(in milliseconds) and
easing
options (see module:ol/easing).
To chain together multiple animations, call the method with multiple animation objects. For example, to first zoom and then pan:
view.animate({zoom: 10}, {center: [0, 0]});
If you provide a function as the last argument to the animate method, it
will get called at the end of an animation series. The callback will be
called with true
if the animation series completed on its own or false
if it was cancelled.
Animations are cancelled by user interactions (e.g. dragging the map) or by
calling view.setCenter()
, view.setResolution()
, or view.setRotation()
(or another method that calls one of these).
Rest
...args: (AnimationOptions | ((arg0: boolean) => void))[]Protected
applyProtected
Apply any properties from another object without triggering events.
The source object.
Calculate the extent for the current view state and the passed box size.
Optional
size: SizeThe pixel dimensions of the box
into which the calculated extent should fit. Defaults to the size of the
map the view is associated with.
If no map or multiple maps are connected to the view, provide the desired
box size (e.g. map.getSize()
).
Extent.
Dispatches an event and calls all listeners listening for events
of this type. The event parameter can either be a string or an
Object with a type
property.
Event object.
false
if anyone called preventDefault on the
event object or if any of the listeners returned false.
Protected
disposeNotify the View that an interaction has ended. The view state will be resolved to a stable one if needed (depending on its constraints).
Optional
duration: numberAnimation duration in ms.
Optional
resolutionDirection: numberWhich direction to zoom.
Optional
anchor: CoordinateThe origin of the transformation.
Notify the View that an interaction has ended. The view state will be resolved to a stable one if needed (depending on its constraints).
Optional
duration: numberAnimation duration in ms.
Optional
resolutionDirection: numberWhich direction to zoom.
Optional
anchor: CoordinateThe origin of the transformation.
Fit the given geometry or extent based on the given map size and border.
The size is pixel dimensions of the box to fit the extent into.
In most cases you will want to use the map size, that is map.getSize()
.
Takes care of the map angle.
The geometry or extent to fit the view to.
Optional
options: FitOptionsOptions.
The geometry.
Optional
options: FitOptionsOptions.
Get a valid position for the view center according to the current constraints.
Target center position.
Optional
targetResolution: numberTarget resolution. If not supplied, the current one will be used. This is useful to guess a valid center position at a different zoom level.
Valid center position.
Get a valid resolution according to the current view constraints.
Target resolution.
Optional
direction: numberIndicate which resolution should be used by a renderer if the view resolution does not match any resolution of the tile source. If 0, the nearest resolution will be used. If 1, the nearest lower resolution will be used. If -1, the nearest higher resolution will be used.
Valid resolution.
Get a valid zoom level according to the current view constraints.
Target zoom.
Optional
direction: numberIndicate which resolution should be used by a renderer if the view resolution does not match any resolution of the tile source. If 0, the nearest resolution will be used. If 1, the nearest lower resolution will be used. If -1, the nearest higher resolution will be used.
Valid zoom level.
Return a function that returns a value between 0 and 1 for a resolution. Exponential scaling is assumed.
Optional
power: numberPower.
Resolution for value function.
Get an updated version of the view options used to construct the view. The current resolution (or zoom), center, and rotation are applied to any stored options. The provided options can be used to apply new min/max zoom or resolution limits.
New options to be applied.
New options updated with the current view state.
Return a function that returns a resolution for a value between 0 and 1. Exponential scaling is assumed.
Optional
power: numberPower.
Value for resolution function.
Protected
onceProtected
onIf any constraints need to be applied, an animation will be triggered. This is typically done on interaction end. Note: calling this with a duration of 0 will apply the constrained values straight away, without animation.
Optional
duration: numberThe animation duration in ms.
Optional
resolutionDirection: numberWhich direction to zoom.
Optional
anchor: CoordinateThe origin of the transformation.
Calculate rotated extent
The geometry.
The rotated extent for the geometry.
Sets a collection of key-value pairs. Note that this changes any existing properties and adds new ones (it does not remove any existing properties).
Values.
Optional
silent: booleanUpdate without triggering an event.
Stores the viewport size on the view. The viewport size is not read every time from the DOM to avoid performance hit and layout reflow. This should be done on map size change. Note: the constraints are not resolved during an animation to avoid stopping it
Optional
size: SizeViewport size; if undefined, [100, 100] is assumed
Protected
un
Classdesc
A View object represents a simple 2D view of the map.
This is the object to act upon to change the center, resolution, and rotation of the map.
A View has a
projection
. The projection determines the coordinate system of the center, and its units determine the units of the resolution (projection units per pixel). The default projection is Web Mercator (EPSG:3857).The view states
A View is determined by three states:
center
,resolution
, androtation
. Each state has a corresponding getter and setter, e.g.getCenter
andsetCenter
for thecenter
state.The
zoom
state is actually not saved on the view: all computations internally use theresolution
state. Still, thesetZoom
andgetZoom
methods are available, as well asgetResolutionForZoom
andgetZoomForResolution
to switch from one system to the other.The constraints
setCenter
,setResolution
andsetRotation
can be used to change the states of the view, but any constraint defined in the constructor will be applied along the way.A View object can have a resolution constraint, a rotation constraint and a center constraint.
The resolution constraint typically restricts min/max values and snaps to specific resolutions. It is determined by the following options:
resolutions
,maxResolution
,maxZoom
andzoomFactor
. Ifresolutions
is set, the other three options are ignored. See documentation for each option for more information. By default, the view only has a min/max restriction and allow intermediary zoom levels when pinch-zooming for example.The rotation constraint snaps to specific angles. It is determined by the following options:
enableRotation
andconstrainRotation
. By default rotation is allowed and its value is snapped to zero when approaching the horizontal.The center constraint is determined by the
extent
option. By default the view center is not constrained at all.Changing the view state
It is important to note that
setZoom
,setResolution
,setCenter
andsetRotation
are subject to the above mentioned constraints. As such, it may sometimes not be possible to know in advance the resulting state of the View. For example, callingsetResolution(10)
does not guarantee thatgetResolution()
will return10
.A consequence of this is that, when applying a delta on the view state, one should use
adjustCenter
,adjustRotation
,adjustZoom
andadjustResolution
rather than the corresponding setters. This will let view do its internal computations. Besides, theadjust*
methods also take ananchor
argument which allows specifying an origin for the transformation.Interacting with the view
View constraints are usually only applied when the view is at rest, meaning that no interaction or animation is ongoing. As such, if the user puts the view in a state that is not equivalent to a constrained one (e.g. rotating the view when the snap angle is 0), an animation will be triggered at the interaction end to put back the view to a stable state;
Api