[76] | 1 | /* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for |
---|
| 2 | * full list of contributors). Published under the Clear BSD license. |
---|
| 3 | * See http://svn.openlayers.org/trunk/openlayers/license.txt for the |
---|
| 4 | * full text of the license. */ |
---|
| 5 | |
---|
| 6 | |
---|
| 7 | /** |
---|
| 8 | * @requires OpenLayers/Handler/Drag.js |
---|
| 9 | */ |
---|
| 10 | |
---|
| 11 | /** |
---|
| 12 | * Class: OpenLayers.Handler.RegularPolygon |
---|
| 13 | * Handler to draw a regular polygon on the map. Polygon is displayed on mouse |
---|
| 14 | * down, moves or is modified on mouse move, and is finished on mouse up. |
---|
| 15 | * The handler triggers callbacks for 'done' and 'cancel'. Create a new |
---|
| 16 | * instance with the <OpenLayers.Handler.RegularPolygon> constructor. |
---|
| 17 | * |
---|
| 18 | * Inherits from: |
---|
| 19 | * - <OpenLayers.Handler> |
---|
| 20 | */ |
---|
| 21 | OpenLayers.Handler.RegularPolygon = OpenLayers.Class(OpenLayers.Handler.Drag, { |
---|
| 22 | |
---|
| 23 | /** |
---|
| 24 | * APIProperty: sides |
---|
| 25 | * {Integer} Number of sides for the regular polygon. Needs to be greater |
---|
| 26 | * than 2. Defaults to 4. |
---|
| 27 | */ |
---|
| 28 | sides: 4, |
---|
| 29 | |
---|
| 30 | /** |
---|
| 31 | * APIProperty: radius |
---|
| 32 | * {Float} Optional radius in map units of the regular polygon. If this is |
---|
| 33 | * set to some non-zero value, a polygon with a fixed radius will be |
---|
| 34 | * drawn and dragged with mose movements. If this property is not |
---|
| 35 | * set, dragging changes the radius of the polygon. Set to null by |
---|
| 36 | * default. |
---|
| 37 | */ |
---|
| 38 | radius: null, |
---|
| 39 | |
---|
| 40 | /** |
---|
| 41 | * APIProperty: snapAngle |
---|
| 42 | * {Float} If set to a non-zero value, the handler will snap the polygon |
---|
| 43 | * rotation to multiples of the snapAngle. Value is an angle measured |
---|
| 44 | * in degrees counterclockwise from the positive x-axis. |
---|
| 45 | */ |
---|
| 46 | snapAngle: null, |
---|
| 47 | |
---|
| 48 | /** |
---|
| 49 | * APIProperty: snapToggle |
---|
| 50 | * {String} If set, snapToggle is checked on mouse events and will set |
---|
| 51 | * the snap mode to the opposite of what it currently is. To disallow |
---|
| 52 | * toggling between snap and non-snap mode, set freehandToggle to |
---|
| 53 | * null. Acceptable toggle values are 'shiftKey', 'ctrlKey', and |
---|
| 54 | * 'altKey'. Snap mode is only possible if this.snapAngle is set to a |
---|
| 55 | * non-zero value. |
---|
| 56 | */ |
---|
| 57 | snapToggle: 'shiftKey', |
---|
| 58 | |
---|
| 59 | /** |
---|
| 60 | * Property: layerOptions |
---|
| 61 | * {Object} Any optional properties to be set on the sketch layer. |
---|
| 62 | */ |
---|
| 63 | layerOptions: null, |
---|
| 64 | |
---|
| 65 | /** |
---|
| 66 | * APIProperty: persist |
---|
| 67 | * {Boolean} Leave the feature rendered until clear is called. Default |
---|
| 68 | * is false. If set to true, the feature remains rendered until |
---|
| 69 | * clear is called, typically by deactivating the handler or starting |
---|
| 70 | * another drawing. |
---|
| 71 | */ |
---|
| 72 | persist: false, |
---|
| 73 | |
---|
| 74 | /** |
---|
| 75 | * APIProperty: irregular |
---|
| 76 | * {Boolean} Draw an irregular polygon instead of a regular polygon. |
---|
| 77 | * Default is false. If true, the initial mouse down will represent |
---|
| 78 | * one corner of the polygon bounds and with each mouse movement, the |
---|
| 79 | * polygon will be stretched so the opposite corner of its bounds |
---|
| 80 | * follows the mouse position. This property takes precedence over |
---|
| 81 | * the radius property. If set to true, the radius property will |
---|
| 82 | * be ignored. |
---|
| 83 | */ |
---|
| 84 | irregular: false, |
---|
| 85 | |
---|
| 86 | /** |
---|
| 87 | * Property: angle |
---|
| 88 | * {Float} The angle from the origin (mouse down) to the current mouse |
---|
| 89 | * position, in radians. This is measured counterclockwise from the |
---|
| 90 | * positive x-axis. |
---|
| 91 | */ |
---|
| 92 | angle: null, |
---|
| 93 | |
---|
| 94 | /** |
---|
| 95 | * Property: fixedRadius |
---|
| 96 | * {Boolean} The polygon has a fixed radius. True if a radius is set before |
---|
| 97 | * drawing begins. False otherwise. |
---|
| 98 | */ |
---|
| 99 | fixedRadius: false, |
---|
| 100 | |
---|
| 101 | /** |
---|
| 102 | * Property: feature |
---|
| 103 | * {<OpenLayers.Feature.Vector>} The currently drawn polygon feature |
---|
| 104 | */ |
---|
| 105 | feature: null, |
---|
| 106 | |
---|
| 107 | /** |
---|
| 108 | * Property: layer |
---|
| 109 | * {<OpenLayers.Layer.Vector>} The temporary drawing layer |
---|
| 110 | */ |
---|
| 111 | layer: null, |
---|
| 112 | |
---|
| 113 | /** |
---|
| 114 | * Property: origin |
---|
| 115 | * {<OpenLayers.Geometry.Point>} Location of the first mouse down |
---|
| 116 | */ |
---|
| 117 | origin: null, |
---|
| 118 | |
---|
| 119 | /** |
---|
| 120 | * Constructor: OpenLayers.Handler.RegularPolygon |
---|
| 121 | * Create a new regular polygon handler. |
---|
| 122 | * |
---|
| 123 | * Parameters: |
---|
| 124 | * control - {<OpenLayers.Control>} The control that owns this handler |
---|
| 125 | * callbacks - {Object} An object with a properties whose values are |
---|
| 126 | * functions. Various callbacks described below. |
---|
| 127 | * options - {Object} An object with properties to be set on the handler. |
---|
| 128 | * If the options.sides property is not specified, the number of sides |
---|
| 129 | * will default to 4. |
---|
| 130 | * |
---|
| 131 | * Named callbacks: |
---|
| 132 | * create - Called when a sketch is first created. Callback called with |
---|
| 133 | * the creation point geometry and sketch feature. |
---|
| 134 | * done - Called when the sketch drawing is finished. The callback will |
---|
| 135 | * recieve a single argument, the sketch geometry. |
---|
| 136 | * cancel - Called when the handler is deactivated while drawing. The |
---|
| 137 | * cancel callback will receive a geometry. |
---|
| 138 | */ |
---|
| 139 | initialize: function(control, callbacks, options) { |
---|
| 140 | if(!(options && options.layerOptions && options.layerOptions.styleMap)) { |
---|
| 141 | this.style = OpenLayers.Util.extend(OpenLayers.Feature.Vector.style['default'], {}); |
---|
| 142 | } |
---|
| 143 | |
---|
| 144 | OpenLayers.Handler.prototype.initialize.apply(this, |
---|
| 145 | [control, callbacks, options]); |
---|
| 146 | this.options = (options) ? options : {}; |
---|
| 147 | }, |
---|
| 148 | |
---|
| 149 | /** |
---|
| 150 | * APIMethod: setOptions |
---|
| 151 | * |
---|
| 152 | * Parameters: |
---|
| 153 | * newOptions - {Object} |
---|
| 154 | */ |
---|
| 155 | setOptions: function (newOptions) { |
---|
| 156 | OpenLayers.Util.extend(this.options, newOptions); |
---|
| 157 | OpenLayers.Util.extend(this, newOptions); |
---|
| 158 | }, |
---|
| 159 | |
---|
| 160 | /** |
---|
| 161 | * APIMethod: activate |
---|
| 162 | * Turn on the handler. |
---|
| 163 | * |
---|
| 164 | * Return: |
---|
| 165 | * {Boolean} The handler was successfully activated |
---|
| 166 | */ |
---|
| 167 | activate: function() { |
---|
| 168 | var activated = false; |
---|
| 169 | if(OpenLayers.Handler.prototype.activate.apply(this, arguments)) { |
---|
| 170 | // create temporary vector layer for rendering geometry sketch |
---|
| 171 | var options = OpenLayers.Util.extend({ |
---|
| 172 | displayInLayerSwitcher: false, |
---|
| 173 | // indicate that the temp vector layer will never be out of range |
---|
| 174 | // without this, resolution properties must be specified at the |
---|
| 175 | // map-level for this temporary layer to init its resolutions |
---|
| 176 | // correctly |
---|
| 177 | calculateInRange: OpenLayers.Function.True |
---|
| 178 | }, this.layerOptions); |
---|
| 179 | this.layer = new OpenLayers.Layer.Vector(this.CLASS_NAME, options); |
---|
| 180 | this.map.addLayer(this.layer); |
---|
| 181 | activated = true; |
---|
| 182 | } |
---|
| 183 | return activated; |
---|
| 184 | }, |
---|
| 185 | |
---|
| 186 | /** |
---|
| 187 | * APIMethod: deactivate |
---|
| 188 | * Turn off the handler. |
---|
| 189 | * |
---|
| 190 | * Return: |
---|
| 191 | * {Boolean} The handler was successfully deactivated |
---|
| 192 | */ |
---|
| 193 | deactivate: function() { |
---|
| 194 | var deactivated = false; |
---|
| 195 | if(OpenLayers.Handler.Drag.prototype.deactivate.apply(this, arguments)) { |
---|
| 196 | // call the cancel callback if mid-drawing |
---|
| 197 | if(this.dragging) { |
---|
| 198 | this.cancel(); |
---|
| 199 | } |
---|
| 200 | // If a layer's map property is set to null, it means that that |
---|
| 201 | // layer isn't added to the map. Since we ourself added the layer |
---|
| 202 | // to the map in activate(), we can assume that if this.layer.map |
---|
| 203 | // is null it means that the layer has been destroyed (as a result |
---|
| 204 | // of map.destroy() for example. |
---|
| 205 | if (this.layer.map != null) { |
---|
| 206 | this.layer.destroy(false); |
---|
| 207 | if (this.feature) { |
---|
| 208 | this.feature.destroy(); |
---|
| 209 | } |
---|
| 210 | } |
---|
| 211 | this.layer = null; |
---|
| 212 | this.feature = null; |
---|
| 213 | deactivated = true; |
---|
| 214 | } |
---|
| 215 | return deactivated; |
---|
| 216 | }, |
---|
| 217 | |
---|
| 218 | /** |
---|
| 219 | * Method: down |
---|
| 220 | * Start drawing a new feature |
---|
| 221 | * |
---|
| 222 | * Parameters: |
---|
| 223 | * evt - {Event} The drag start event |
---|
| 224 | */ |
---|
| 225 | down: function(evt) { |
---|
| 226 | this.fixedRadius = !!(this.radius); |
---|
| 227 | var maploc = this.map.getLonLatFromPixel(evt.xy); |
---|
| 228 | this.origin = new OpenLayers.Geometry.Point(maploc.lon, maploc.lat); |
---|
| 229 | // create the new polygon |
---|
| 230 | if(!this.fixedRadius || this.irregular) { |
---|
| 231 | // smallest radius should not be less one pixel in map units |
---|
| 232 | // VML doesn't behave well with smaller |
---|
| 233 | this.radius = this.map.getResolution(); |
---|
| 234 | } |
---|
| 235 | if(this.persist) { |
---|
| 236 | this.clear(); |
---|
| 237 | } |
---|
| 238 | this.feature = new OpenLayers.Feature.Vector(); |
---|
| 239 | this.createGeometry(); |
---|
| 240 | this.callback("create", [this.origin, this.feature]); |
---|
| 241 | this.layer.addFeatures([this.feature], {silent: true}); |
---|
| 242 | this.layer.drawFeature(this.feature, this.style); |
---|
| 243 | }, |
---|
| 244 | |
---|
| 245 | /** |
---|
| 246 | * Method: move |
---|
| 247 | * Respond to drag move events |
---|
| 248 | * |
---|
| 249 | * Parameters: |
---|
| 250 | * evt - {Evt} The move event |
---|
| 251 | */ |
---|
| 252 | move: function(evt) { |
---|
| 253 | var maploc = this.map.getLonLatFromPixel(evt.xy); |
---|
| 254 | var point = new OpenLayers.Geometry.Point(maploc.lon, maploc.lat); |
---|
| 255 | if(this.irregular) { |
---|
| 256 | var ry = Math.sqrt(2) * Math.abs(point.y - this.origin.y) / 2; |
---|
| 257 | this.radius = Math.max(this.map.getResolution() / 2, ry); |
---|
| 258 | } else if(this.fixedRadius) { |
---|
| 259 | this.origin = point; |
---|
| 260 | } else { |
---|
| 261 | this.calculateAngle(point, evt); |
---|
| 262 | this.radius = Math.max(this.map.getResolution() / 2, |
---|
| 263 | point.distanceTo(this.origin)); |
---|
| 264 | } |
---|
| 265 | this.modifyGeometry(); |
---|
| 266 | if(this.irregular) { |
---|
| 267 | var dx = point.x - this.origin.x; |
---|
| 268 | var dy = point.y - this.origin.y; |
---|
| 269 | var ratio; |
---|
| 270 | if(dy == 0) { |
---|
| 271 | ratio = dx / (this.radius * Math.sqrt(2)); |
---|
| 272 | } else { |
---|
| 273 | ratio = dx / dy; |
---|
| 274 | } |
---|
| 275 | this.feature.geometry.resize(1, this.origin, ratio); |
---|
| 276 | this.feature.geometry.move(dx / 2, dy / 2); |
---|
| 277 | } |
---|
| 278 | this.layer.drawFeature(this.feature, this.style); |
---|
| 279 | }, |
---|
| 280 | |
---|
| 281 | /** |
---|
| 282 | * Method: up |
---|
| 283 | * Finish drawing the feature |
---|
| 284 | * |
---|
| 285 | * Parameters: |
---|
| 286 | * evt - {Event} The mouse up event |
---|
| 287 | */ |
---|
| 288 | up: function(evt) { |
---|
| 289 | this.finalize(); |
---|
| 290 | // the mouseup method of superclass doesn't call the |
---|
| 291 | // "done" callback if there's been no move between |
---|
| 292 | // down and up |
---|
| 293 | if (this.start == this.last) { |
---|
| 294 | this.callback("done", [evt.xy]); |
---|
| 295 | } |
---|
| 296 | }, |
---|
| 297 | |
---|
| 298 | /** |
---|
| 299 | * Method: out |
---|
| 300 | * Finish drawing the feature. |
---|
| 301 | * |
---|
| 302 | * Parameters: |
---|
| 303 | * evt - {Event} The mouse out event |
---|
| 304 | */ |
---|
| 305 | out: function(evt) { |
---|
| 306 | this.finalize(); |
---|
| 307 | }, |
---|
| 308 | |
---|
| 309 | /** |
---|
| 310 | * Method: createGeometry |
---|
| 311 | * Create the new polygon geometry. This is called at the start of the |
---|
| 312 | * drag and at any point during the drag if the number of sides |
---|
| 313 | * changes. |
---|
| 314 | */ |
---|
| 315 | createGeometry: function() { |
---|
| 316 | this.angle = Math.PI * ((1/this.sides) - (1/2)); |
---|
| 317 | if(this.snapAngle) { |
---|
| 318 | this.angle += this.snapAngle * (Math.PI / 180); |
---|
| 319 | } |
---|
| 320 | this.feature.geometry = OpenLayers.Geometry.Polygon.createRegularPolygon( |
---|
| 321 | this.origin, this.radius, this.sides, this.snapAngle |
---|
| 322 | ); |
---|
| 323 | }, |
---|
| 324 | |
---|
| 325 | /** |
---|
| 326 | * Method: modifyGeometry |
---|
| 327 | * Modify the polygon geometry in place. |
---|
| 328 | */ |
---|
| 329 | modifyGeometry: function() { |
---|
| 330 | var angle, point; |
---|
| 331 | var ring = this.feature.geometry.components[0]; |
---|
| 332 | // if the number of sides ever changes, create a new geometry |
---|
| 333 | if(ring.components.length != (this.sides + 1)) { |
---|
| 334 | this.createGeometry(); |
---|
| 335 | ring = this.feature.geometry.components[0]; |
---|
| 336 | } |
---|
| 337 | for(var i=0; i<this.sides; ++i) { |
---|
| 338 | point = ring.components[i]; |
---|
| 339 | angle = this.angle + (i * 2 * Math.PI / this.sides); |
---|
| 340 | point.x = this.origin.x + (this.radius * Math.cos(angle)); |
---|
| 341 | point.y = this.origin.y + (this.radius * Math.sin(angle)); |
---|
| 342 | point.clearBounds(); |
---|
| 343 | } |
---|
| 344 | }, |
---|
| 345 | |
---|
| 346 | /** |
---|
| 347 | * Method: calculateAngle |
---|
| 348 | * Calculate the angle based on settings. |
---|
| 349 | * |
---|
| 350 | * Parameters: |
---|
| 351 | * point - {<OpenLayers.Geometry.Point>} |
---|
| 352 | * evt - {Event} |
---|
| 353 | */ |
---|
| 354 | calculateAngle: function(point, evt) { |
---|
| 355 | var alpha = Math.atan2(point.y - this.origin.y, |
---|
| 356 | point.x - this.origin.x); |
---|
| 357 | if(this.snapAngle && (this.snapToggle && !evt[this.snapToggle])) { |
---|
| 358 | var snapAngleRad = (Math.PI / 180) * this.snapAngle; |
---|
| 359 | this.angle = Math.round(alpha / snapAngleRad) * snapAngleRad; |
---|
| 360 | } else { |
---|
| 361 | this.angle = alpha; |
---|
| 362 | } |
---|
| 363 | }, |
---|
| 364 | |
---|
| 365 | /** |
---|
| 366 | * APIMethod: cancel |
---|
| 367 | * Finish the geometry and call the "cancel" callback. |
---|
| 368 | */ |
---|
| 369 | cancel: function() { |
---|
| 370 | // the polygon geometry gets cloned in the callback method |
---|
| 371 | this.callback("cancel", null); |
---|
| 372 | this.finalize(); |
---|
| 373 | }, |
---|
| 374 | |
---|
| 375 | /** |
---|
| 376 | * Method: finalize |
---|
| 377 | * Finish the geometry and call the "done" callback. |
---|
| 378 | */ |
---|
| 379 | finalize: function() { |
---|
| 380 | this.origin = null; |
---|
| 381 | this.radius = this.options.radius; |
---|
| 382 | }, |
---|
| 383 | |
---|
| 384 | /** |
---|
| 385 | * APIMethod: clear |
---|
| 386 | * Clear any rendered features on the temporary layer. This is called |
---|
| 387 | * when the handler is deactivated, canceled, or done (unless persist |
---|
| 388 | * is true). |
---|
| 389 | */ |
---|
| 390 | clear: function() { |
---|
| 391 | if (this.layer) { |
---|
| 392 | this.layer.renderer.clear(); |
---|
| 393 | this.layer.destroyFeatures(); |
---|
| 394 | } |
---|
| 395 | }, |
---|
| 396 | |
---|
| 397 | /** |
---|
| 398 | * Method: callback |
---|
| 399 | * Trigger the control's named callback with the given arguments |
---|
| 400 | * |
---|
| 401 | * Parameters: |
---|
| 402 | * name - {String} The key for the callback that is one of the properties |
---|
| 403 | * of the handler's callbacks object. |
---|
| 404 | * args - {Array} An array of arguments with which to call the callback |
---|
| 405 | * (defined by the control). |
---|
| 406 | */ |
---|
| 407 | callback: function (name, args) { |
---|
| 408 | // override the callback method to always send the polygon geometry |
---|
| 409 | if (this.callbacks[name]) { |
---|
| 410 | this.callbacks[name].apply(this.control, |
---|
| 411 | [this.feature.geometry.clone()]); |
---|
| 412 | } |
---|
| 413 | // since sketch features are added to the temporary layer |
---|
| 414 | // they must be cleared here if done or cancel |
---|
| 415 | if(!this.persist && (name == "done" || name == "cancel")) { |
---|
| 416 | this.clear(); |
---|
| 417 | } |
---|
| 418 | }, |
---|
| 419 | |
---|
| 420 | CLASS_NAME: "OpenLayers.Handler.RegularPolygon" |
---|
| 421 | }); |
---|