Monthly Archives: 7月 2013 - Page 4

OpenLayersのMap functionについて[Chapter 32]

OpenLayersを使ってみる。[Chapter 32]

OpenLayersのMap Class Propertiesについて-5[Chapter 31] に引き続き、OpenLayersのMap functionsについての基本を学んでおきます。

OpenLayers 2.10 Beginner's Guideなる書籍の章立てにあわせて、OpenLayersの使い方を学んでいきます。

OpenLayers Mapについての詳細は、OpenLayers.Map を参考にしてください。

Map functions

ここでは、Map classのよく使うfunctionsについて学んでいきます。すべてのfunctionsについては、
OpenLayers.Map を参考にしてください。

これまでにMap classのmethodとして、addLayerやzoomToMaxExtentなどを使ってきましたが、ここではそれぞれ関連した機能毎にfunctionsを整理してみます。 

Control関連のfunction

addControl( control )

Parameters—control {OpenLayers.Control}. This function takes in a single control object and adds it to the map.

addControl( control )

addControl( control )Parameters—controls {Array {OpenLayers.Control}}. This function takes in an array of control objects and adds them to the map.

getControl( match )

Parameters—match {String}. Accepts one argument, the ID of a control. It will return a control object, if found, that matches the ID passed in. Returns: {OpenLayers.Control} or null. If no match is found, returns null.

getControlsBy( property, match )

Parameters—property {String}, match {String or Object}. This is an extremely useful function that is sometimes overlooked. If you need to get control objects that match some criteria, this is the function to use. It accepts two arguments, a property (such as 'active'), and a match (such as true). The match argument can be either a string, regular expression, or Boolean. The property is the string name of any property of a control—so, if you want to get all the controls that are active, you would call map.getControlsBy('active', true);. Returns: {{Array of OpenLayers.Control objects}} or null. If no match is found, returns null; otherwise, returns an array of matched control objects.

getControlsByClass( match )

Parameters—match {String or Object}. Similar to getControlsBy, but instead will perform a match for class name. Calling this function and passing in a string containing the class name (or a regular expression) will return either null or an array of control objects. Returns: {Array of OpenLayers.Control objects} or null.

removeControl( control )

Parameters—control { OpenLayers.Control }. This function takes in a single parameter, an OpenLayers Control object, and removes it from the map. Removing a control will affect the map. controls array, so be aware of this if you are using indexes to reference control objects in other places of your code. This is another reason why creating a variable to reference control objects is preferred, as you don't have to worry about the order of the map.controls array.

Extent/Coordinate/Bounds関連のfunction

map上のposition情報を得るためや移動させるためのfunctionsを整理します。 例えばOpenLayers.LonLat objectのようなものです。
codeとしては、
var my_lonat_object = new OpenLayers.LonLat(-42.18, 32.20);
のようなobjectです。

getCenter()

Returns{OpenLayers.LonLat}. Calling this function will return a LonLat object containing the center point of the map.

getExtent()

Returns {OpenLayers.Bounds}. Returns the current extent of the map.

‹ getMaxExtent()

Returns {OpenLayers.Bounds}. Returns a Bounds object consisting of the map's max extent; essentially, it returns the value of the map.maxExtent property.

getMaxResolution()

Returns {Float}. Returns the maximum resolution of the map.

getNumZoomLevels()

Returns {Integer}. The number of zoom levels the map contains is returned.

getResolution()

Returns {Float}. Returns the map's current resolution.

getResolutionForZoom( zoom )

Parameters are zoom { Integer }. This function allows you to pass in a zoom level, zoom (an {Integer}), and receive the resolution for that zoom level. Returns: {Float}. Returns the resolution for a passed in zoom level.

getScale()

Returns {Float}. Returns the map's current scale value.

getZoom()

Returns {Integer}. Returns the current zoom level value, which is also the value of the map.zoom property.

getZoomForExtent(bounds, closest)

Parameters are bounds {OpenLayers.Bounds}, closest {Boolean} (Optional). Takes in an
OpenLayers.Bounds object and an optional closest argument (default value is false) and returns a level for the passed in bounds. If closest is set to true, a suitable zoom level is returned that may not fully contain the entire extent. Returns: {Integer}. This returns a zoom level appropriate for the passed in bounds.

getZoomForResolution(resolution, closest)

Parameters: bounds {OpenLayers.Bounds}, closest {Boolean} (Optional). Similar to getZoomForExtent; takes in a resolution and optional closest argument and returns a zoom level. Returns: {Integer}. Returns a zoom level appropriate for the passed in resolution.

isValidLonLat( lonlat )

Parameters are lonlat {OpenLayers.LonLat}. Takes in a single lonlat object and returns a Boolean specifying if the passed in coordinate is within the extent of the map. Returns: {Boolean}. Whether or not the passed in point is within the map's maxExtent.

isValidZoomLevel( zoomLevel )

Parameters are zoomLevel {Integer}. This function accepts a single zoomLevel parameter and returns true or false if the passed in zoom level is within the range of map zoom levels. Returns: {Boolean}. Whether the passed in zoom level is within range of map zoom levels.

moveTo( lonlat, zoom, options )

Parameters are lonlat {OpenLayers.LonLat}, zoom {Integer}, options {Object} (Optional). Takes in an OpenLayers.LonLat object, zoom level, and optional options object. This function will move the map to the specified coordinate and zoom level, but will not show any panning animations.

pan( dx, dy, options )

Parameters are dx {Integer}, dy {Integer}, options {Object} (Optional). This function takes in two integer parameters and an optional options object. The dx parameter specifies the distance to pan the map in the x (longitude) direction and it can be either positive or negative. The dy parameters specifies how much to pan the map in the y (latitude) direction. The options object can consist of two properties: animate {Boolean} specifies if the panning animation will be enabled. Default value is true. The second property is dragging {Boolean}, which specifies whether or not to call setCenter with dragging, the default value is false.

panTo( lonlat )

Parameters—lonlat {OpenLayers.LonLat}. Pans the map to a passed in coordinate (an OpenLayers.LonLat object). This will perform any associated panning animations if the passed in coordinate is within the current extent.

setCenter( lonlat, zoom, dragging )

Parameter—lonlat {OpenLayers.LonLat}, zoom {Integer} (Optional), dragging {Boolean}
(Optional). This function will set the map's center to the passed in coordinate and (optionally) zoom level. If dragging is set to true (it is true by default), movestart and moveend events will be triggered.

zoomIn()

Calling zoomIn() will cause the map to zoom in the next zoom level, if possible.

zoomOut()

Calling zoomOut() will cause the map to zoom out one zoom level, if possible.

zoomTo( zoomLevel )

Parameters—zoomLevel {Integer}. Takes in a zoom level and zooms the map to the specified zoom level.

zoomToExtent( bounds, closest )

Parameters—bounds {OpenLayers.Bounds}, closest {Boolean} (Optional). Zooms to the passed in bounds and re-centers the map. By default, closest is set to false. If it is true, a zoom level that most closely fits the bounds will be found, but it may not fully contain the extent.

Layer関連のfunction

Layer actionに関係するlayer追加、layerの削除などに関連するfunctionsです。

addLayer( layer )

Parameters—layer {OpenLayers.Layer}. Takes in a layer object and adds it to the map. The layer object can be an already instantiated object, or you can instantiate a layer object on the fly in the call itself.

addLayers( layers )

Parameters—layers {Array{OpenLayers.Layer}}. This function takes in an array of layer objects and adds them to the map. Like in the addLayer function, you can pass in already instantiated layers or instantiate them on the fly. It is recommended that you instantiate layer objects so you can refer to them by name, but either way is acceptable.

raiseLayer( layer, delta )

Parameters—layer {OpenLayers.Layer}, delta {Integer}. This allows you to change the order layers appear on the map, allowing you to place layers above or below other layers. This function changes the order of the layer by the passed in delta value. If delta is positive, the layer is moved up in the map.layers array by delta. If it is negative, it is moved down by delta. We'll be using this function later in the book to move layers up and down the layer list.

removeLayer( layer, setNewBaseLayer )

Parameters—layer {OpenLayers.Layer}, setNewBaseLayer {Boolean}(Optional). This function will remove a passed in layer from the map. It removes the associated HTML
elements, removes the layer from the map's layer list, set's the layer's map value
to null, and triggers a removelayer event. The setNewBaseLayer property is optional and defaults to true, which will attempt to set a new base layer if need be.

getNumLayers()

Returns: {Integer}. Returns the number of layers on the map.

その他のfunction

重要ではあるが、カテゴリーに分類できないfunctionsです。

destroy():

Calling destroy() will do what you would imagine—it destroys the map object. After the map is destroyed, the map object is essentially made useless.

getLonLatFromPixel( pixel )

Parameters—pixel {OpenLayers.Pixel}. This function returns an {OpenLayers.LonLat} object based on the passed in pixel—whatever coordinates are passed in that pixel is returned. An example call would be map.getLonLatFromPixel(new OpenLayers.Pixel(250,250));. We'll be using this function later in the book. Returns: {OpenLayers.LonLat}. Returns a LonLat object from the passed in pixel.

‹

getPixelFromLonLat( lonlat )

Parameters—lonlat {OpenLayers.LonLat}. This function will return a pixel location based on a passed in lonlat coordinate. The returned pixel coordinate is returned in view port coordinates (meaning, the pixel location is relative to the map div element). This function is quite useful if you want to, for instance, display another div on top of your map at a specified coordinate. We will be using this function later in the book. Returns: {OpenLayers.Pixel}. It returns an OpenLayers.Pixel from the
passed in coordinate.

render( element )

Parameters—element {HTML element or String (of ID of element)}. This function takes in a single parameter—an HTML element or the ID of an element you wish to render the map to. We saw this function in action earlier in this chapter. If you do not pass in an HTML element (or ID) to the map object when you create it, you can delay rendering and later call this render method. This function will render the map to the element that is passed in.

updateSize()

This function should be called whenever the map div's size is updated. For example, if you have a resize-able div that the map is placed in, then your code should call map.updateSize() whenever that div is resized.

今回のまとめ

OpenLayersのMap functionの基本について概要を学びました。引用が英語ばかりですいません、たぶん難しい英語ではないので、理解できると思います。(ちょい、手抜き。 追って日本語しま~~す。)
FireFoxのFirebugなどのコンソールからいろんなfunctionを動かしてみると、その機能がわかると思います。
次回は、Map eventについて学んでいきます。

また、本tutorialは、htmlやCSSやJavaScriptの基本的なことはある程度理解している前提で今後も話を進めていきます。また、誤字、脱字、spell間違いや勘違いも多々出てくると考えられます。
それは違うじゃん!!とかいろんな意見をいただければと思います。
そこんところ ヨロシク~~!!

OpenLayers Tutorialの目次に戻る。

Social Widgets powered by AB-WebLog.com.