Files
openlayers/edit/apidoc/ol.View2D.html
2013-09-14 00:29:38 +02:00

1575 lines
26 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>OpenLayers 3 API Documentation - Class: ol.View2D</title>
<script src="scripts/prettify/prettify.js"> </script>
<script src="scripts/prettify/lang-css.js"> </script>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="styles/prettify-jsdoc.css">
<link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
<link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
<link rel="stylesheet" href="../resources/layout.css" type="text/css">
<link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="brand" href="./">OpenLayers 3 API Documentation - Class: ol.View2D</a>
<ul class="nav pull-right">
<li><iframe class="github-watch-button" src="http://ghbtns.com/github-btn.html?user=openlayers&repo=ol3&type=watch&count=true"
allowtransparency="true" frameborder="0" scrolling="0" height="20" width="90"></iframe></li>
<li><a href="https://twitter.com/share" class="twitter-share-button" data-count="none" data-hashtags="openlayers">&nbsp;</a></li>
<li><div class="g-plusone-wrapper"><div class="g-plusone" data-size="medium" data-annotation="none"></div></div></li>
</ul>
</div>
</div>
</div>
<div id="main">
<section>
<header>
<h2>
<span class="ancestors"><a href="ol.html">ol</a>.</span>
ol.View2D
</h2>
<div class="class-description"><p>An ol.View2D object represents a simple 2D view of the map.</p>
<p>This is the object to act upon to change the center, resolution,
and rotation of the map.</p>
<h3>The view states</h3>
<p>An <code>ol.View2D</code> is determined by three states: <code>center</code>, <code>resolution</code>,
and <code>rotation</code>. To each state corresponds a getter and a setter. E.g.
<code>getCenter</code> and <code>setCenter</code> for the <code>center</code> state.</p>
<p>An <code>ol.View2D</code> has a <code>projection</code>. 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
Spherical Mercator (EPSG:3857).</p>
<h3>The constraints</h3>
<p><code>setCenter</code>, <code>setResolution</code> and <code>setRotation</code> can be used to change the
states of the view. Any value can be passed to the setters. And the value
that is passed to a setter will effectively be the value set in the view,
and returned by the corresponding getter.</p>
<p>But an <code>ol.View2D</code> object also has a <em>resolution constraint</em> and a
<em>rotation constraint</em>. There's currently no <em>center constraint</em>, but
this may change in the future.</p>
<p>As said above no constraints are applied when the setters are used to set
new states for the view. Applying constraints is done explicitly through
the use of the <code>constrain*</code> functions (<code>constrainResolution</code> and
<code>constrainRotation</code>).</p>
<p>The main users of the constraints are the interactions and the
controls. For example, double-clicking on the map changes the view to
the "next" resolution. And releasing the fingers after pinch-zooming
snaps to the closest resolution (with an animation).</p>
<p>So the <em>resolution constraint</em> snaps to specific resolutions. It is
determined by the following options: <code>resolutions</code>, <code>maxResolution</code>,
<code>maxZoom</code>, and <code>zoomFactor</code>. If <code>resolutions</code> is set, the other three
options are ignored. See <a href="ol.html#View2DOptions">ol.View2DOptions</a> for more information.</p>
<p>The <em>rotation constaint</em> is currently not configurable. It snaps the
rotation value to zero when approaching the horizontal.</p></div>
</header>
<article>
<div class="container-overview">
<dt>
<h4 class="name" id="View2D"><span class="type-signature"></span>new View2D</h4>
</dt>
<dd>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>options</code></td>
<td class="type">
<span class="param-type"><a href="ol.html#View2DOptions">ol.View2DOptions</a></span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last">(Optional) <p>View2D options.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>view2d.js, line 87</li></ul></dd>
</dl>
</dd>
</div>
<h3 class="subsection-title">Methods</h3>
<dl>
<dt>
<h4 class="name" id="calculateExtent"><span class="type-signature"></span>calculateExtent</h4>
</dt>
<dd>
<div class="description">
<p>Calculate the extent for the given size in pixels, based on the current
resolution and the current center.</p>
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>size</code></td>
<td class="type">
<span class="param-type"><a href="ol.html#Size">ol.Size</a></span>
</td>
<td class="description last"><p>Box pixel size.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>view2d.js, line 221</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
<p>Extent.</p>
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">ol.Extent</span>
</dd>
</dl>
</dd>
<dt>
<h4 class="name" id="constrainResolution"><span class="type-signature"></span>constrainResolution</h4>
</dt>
<dd>
<div class="description">
<p>Get the constrained the resolution of this view.</p>
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>resolution</code></td>
<td class="type">
<span class="param-type">number</span>
|
<span class="param-type">undefined</span>
</td>
<td class="attributes">
</td>
<td class="description last"><p>Resolution.</p></td>
</tr>
<tr>
<td class="name"><code>delta</code></td>
<td class="type">
<span class="param-type">number</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last">(Optional) <p>Delta.</p></td>
</tr>
<tr>
<td class="name"><code>direction</code></td>
<td class="type">
<span class="param-type">number</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last">(Optional) <p>Direction.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>view2d.js, line 182</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
<p>Constrained resolution.</p>
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">number</span>
|
<span class="param-type">undefined</span>
</dd>
</dl>
</dd>
<dt>
<h4 class="name" id="constrainRotation"><span class="type-signature"></span>constrainRotation</h4>
</dt>
<dd>
<div class="description">
<p>Get the constrained rotation of this view.</p>
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>rotation</code></td>
<td class="type">
<span class="param-type">number</span>
|
<span class="param-type">undefined</span>
</td>
<td class="attributes">
</td>
<td class="description last"><p>Rotation.</p></td>
</tr>
<tr>
<td class="name"><code>delta</code></td>
<td class="type">
<span class="param-type">number</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last">(Optional) <p>Delta.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>view2d.js, line 196</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
<p>Constrained rotation.</p>
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">number</span>
|
<span class="param-type">undefined</span>
</dd>
</dl>
</dd>
<dt>
<h4 class="name" id="fitExtent"><span class="type-signature"></span>fitExtent</h4>
</dt>
<dd>
<div class="description">
<p>Fit the given extent based on the given map size.</p>
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>extent</code></td>
<td class="type">
<span class="param-type">ol.Extent</span>
</td>
<td class="description last"><p>Extent.</p></td>
</tr>
<tr>
<td class="name"><code>size</code></td>
<td class="type">
<span class="param-type"><a href="ol.html#Size">ol.Size</a></span>
</td>
<td class="description last"><p>Box pixel size.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>view2d.js, line 396</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="getZoom"><span class="type-signature"></span>getZoom</h4>
</dt>
<dd>
<div class="description">
<p>Get the current zoom level. Return undefined if the current
resolution is undefined or not a "constrained resolution".</p>
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>view2d.js, line 371</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
<p>Zoom.</p>
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">number</span>
|
<span class="param-type">undefined</span>
</dd>
</dl>
</dd>
<dt>
<h4 class="name" id="setCenter"><span class="type-signature"></span>setCenter</h4>
</dt>
<dd>
<div class="description">
<p>Set the center of the current view.</p>
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>center</code></td>
<td class="type">
<span class="param-type"><a href="ol.html#Coordinate">ol.Coordinate</a></span>
|
<span class="param-type">undefined</span>
</td>
<td class="description last"><p>Center.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>view2d.js, line 417</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="setProjection"><span class="type-signature"></span>setProjection</h4>
</dt>
<dd>
<div class="description">
<p>Set the projection of this view.</p>
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>projection</code></td>
<td class="type">
<span class="param-type"><a href="ol.Projection.html">ol.Projection</a></span>
|
<span class="param-type">undefined</span>
</td>
<td class="description last"><p>Projection.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>view2d.js, line 430</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="setResolution"><span class="type-signature"></span>setResolution</h4>
</dt>
<dd>
<div class="description">
<p>Set the resolution for this view.</p>
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>resolution</code></td>
<td class="type">
<span class="param-type">number</span>
|
<span class="param-type">undefined</span>
</td>
<td class="description last"><p>Resolution.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>view2d.js, line 443</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="setRotation"><span class="type-signature"></span>setRotation</h4>
</dt>
<dd>
<div class="description">
<p>Set the rotation for this view.</p>
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>rotation</code></td>
<td class="type">
<span class="param-type">number</span>
|
<span class="param-type">undefined</span>
</td>
<td class="description last"><p>Rotation.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>view2d.js, line 456</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="setZoom"><span class="type-signature"></span>setZoom</h4>
</dt>
<dd>
<div class="description">
<p>Zoom to a specific zoom level.</p>
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>zoom</code></td>
<td class="type">
<span class="param-type">number</span>
</td>
<td class="description last"><p>Zoom level.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>view2d.js, line 469</li></ul></dd>
</dl>
</dd>
</dl>
</article>
</section>
</div>
<nav>
<h2><a href="index.html">Index</a></h2><h3>Classes</h3><ul><li><a href="ol.Attribution.html">ol.Attribution</a></li><li><a href="ol.Collection.html">ol.Collection</a></li><li><a href="ol.DeviceOrientation.html">ol.DeviceOrientation</a></li><li><a href="ol.Feature.html">ol.Feature</a></li><li><a href="ol.Geolocation.html">ol.Geolocation</a></li><li><a href="ol.Map.html">ol.Map</a></li><li><a href="ol.MapBrowserEvent.html">ol.MapBrowserEvent</a></li><li><a href="ol.Object.html">ol.Object</a></li><li><a href="ol.Overlay.html">ol.Overlay</a></li><li><a href="ol.Projection.html">ol.Projection</a></li><li><a href="ol.View2D.html">ol.View2D</a></li><li><a href="ol.control.Attribution.html">ol.control.Attribution</a></li><li><a href="ol.control.Control.html">ol.control.Control</a></li><li><a href="ol.control.FullScreen.html">ol.control.FullScreen</a></li><li><a href="ol.control.Logo.html">ol.control.Logo</a></li><li><a href="ol.control.MousePosition.html">ol.control.MousePosition</a></li><li><a href="ol.control.ScaleLine.html">ol.control.ScaleLine</a></li><li><a href="ol.control.Zoom.html">ol.control.Zoom</a></li><li><a href="ol.control.ZoomSlider.html">ol.control.ZoomSlider</a></li><li><a href="ol.control.ZoomToExtent.html">ol.control.ZoomToExtent</a></li><li><a href="ol.dom.Input.html">ol.dom.Input</a></li><li><a href="ol.geom.Geometry.html">ol.geom.Geometry</a></li><li><a href="ol.geom.LineString.html">ol.geom.LineString</a></li><li><a href="ol.geom.MultiLineString.html">ol.geom.MultiLineString</a></li><li><a href="ol.geom.MultiPoint.html">ol.geom.MultiPoint</a></li><li><a href="ol.geom.MultiPolygon.html">ol.geom.MultiPolygon</a></li><li><a href="ol.geom.Point.html">ol.geom.Point</a></li><li><a href="ol.geom.Polygon.html">ol.geom.Polygon</a></li><li><a href="ol.geom.SharedVertices.html">ol.geom.SharedVertices</a></li><li><a href="ol.geom2.LineStringCollection.html">ol.geom2.LineStringCollection</a></li><li><a href="ol.geom2.PointCollection.html">ol.geom2.PointCollection</a></li><li><a href="ol.interaction.DragRotateAndZoom.html">ol.interaction.DragRotateAndZoom</a></li><li><a href="ol.interaction.Modify.html">ol.interaction.Modify</a></li><li><a href="ol.interaction.Select.html">ol.interaction.Select</a></li><li><a href="ol.layer.Group.html">ol.layer.Group</a></li><li><a href="ol.layer.Image.html">ol.layer.Image</a></li><li><a href="ol.layer.Layer.html">ol.layer.Layer</a></li><li><a href="ol.layer.Tile.html">ol.layer.Tile</a></li><li><a href="ol.layer.Vector.html">ol.layer.Vector</a></li><li><a href="ol.layer.Vector2.html">ol.layer.Vector2</a></li><li><a href="ol.parser.GPX.html">ol.parser.GPX</a></li><li><a href="ol.parser.GeoJSON.html">ol.parser.GeoJSON</a></li><li><a href="ol.parser.KML.html">ol.parser.KML</a></li><li><a href="ol.parser.TopoJSON.html">ol.parser.TopoJSON</a></li><li><a href="ol.parser.WKT.html">ol.parser.WKT</a></li><li><a href="ol.parser.ogc.GML_v2.html">ol.parser.ogc.GML_v2</a></li><li><a href="ol.parser.ogc.GML_v3.html">ol.parser.ogc.GML_v3</a></li><li><a href="ol.parser.ogc.WMSCapabilities.html">ol.parser.ogc.WMSCapabilities</a></li><li><a href="ol.parser.ogc.WMTSCapabilities.html">ol.parser.ogc.WMTSCapabilities</a></li><li><a href="ol.source.BingMaps.html">ol.source.BingMaps</a></li><li><a href="ol.source.ImageStatic.html">ol.source.ImageStatic</a></li><li><a href="ol.source.ImageWMS.html">ol.source.ImageWMS</a></li><li><a href="ol.source.MapQuestOSM.html">ol.source.MapQuestOSM</a></li><li><a href="ol.source.MapQuestOpenAerial.html">ol.source.MapQuestOpenAerial</a></li><li><a href="ol.source.OSM.html">ol.source.OSM</a></li><li><a href="ol.source.Stamen.html">ol.source.Stamen</a></li><li><a href="ol.source.Tile.html">ol.source.Tile</a></li><li><a href="ol.source.TileDebug.html">ol.source.TileDebug</a></li><li><a href="ol.source.TileJSON.html">ol.source.TileJSON</a></li><li><a href="ol.source.TileWMS.html">ol.source.TileWMS</a></li><li><a href="ol.source.Vector.html">ol.source.Vector</a></li><li><a href="ol.source.Vector2.html">ol.source.Vector2</a></li><li><a href="ol.source.WMTS.html">ol.source.WMTS</a></li><li><a href="ol.source.XYZ.html">ol.source.XYZ</a></li><li><a href="ol.structs.Buffer.html">ol.structs.Buffer</a></li><li><a href="ol.style.Fill.html">ol.style.Fill</a></li><li><a href="ol.style.Icon.html">ol.style.Icon</a></li><li><a href="ol.style.Rule.html">ol.style.Rule</a></li><li><a href="ol.style.Shape.html">ol.style.Shape</a></li><li><a href="ol.style.Stroke.html">ol.style.Stroke</a></li><li><a href="ol.style.Style.html">ol.style.Style</a></li><li><a href="ol.style.Text.html">ol.style.Text</a></li><li><a href="ol.tilegrid.TileGrid.html">ol.tilegrid.TileGrid</a></li><li><a href="ol.tilegrid.WMTS.html">ol.tilegrid.WMTS</a></li><li><a href="ol.tilegrid.XYZ.html">ol.tilegrid.XYZ</a></li></ul><h3>Namespaces</h3><ul><li><a href="ol.html">ol</a></li><li><a href="ol.animation.html">ol.animation</a></li><li><a href="ol.control.html">ol.control</a></li><li><a href="ol.expr.html">ol.expr</a></li><li><a href="ol.geom.html">ol.geom</a></li><li><a href="ol.layer.html">ol.layer</a></li><li><a href="ol.parser.html">ol.parser</a></li><li><a href="ol.proj.html">ol.proj</a></li><li><a href="ol.source.html">ol.source</a></li><li><a href="ol.style.html">ol.style</a></li><li><a href="ol.tilegrid.html">ol.tilegrid</a></li></ul><h3>Tutorials</h3><ul><li><a href="tutorial-ol3.html">OpenLayers 3 Architecture</a></li></ul><h3>Global</h3><ul><li><a href="global.html#Meters per unit lookup table.">Meters per unit lookup table.</a></li><li><a href="global.html#grid">grid</a></li><li>{boolean}</li><li>{number}</li><li>{string}</li></ul>
</nav>
<br clear="both">
<footer>
Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3</a>
</footer>
<script> prettyPrint(); </script>
<script src="../resources/social-links.js" type="text/javascript"></script>
</body>
</html>