Hey Tim- I thought this was a great idea - and actually overlooked your attachment until just recently. When I didn't see the example online, I started fresh on this.
Turns out it's quite different than the one that you put together. I needed different sorts of configuration options. So, for my version of regular polygon drawing (and approximating circles), see http://dev.openlayers.org/sandbox/tschaub/feature/examples/regular-polygons.html Thanks for the inspiration, Tim (Note that this requires a few patches that aren't in the trunk yet.) Tim Langlois wrote: > I wrote a custom handler to draw an N-sided regular polygon by clicking > and dragging a line to specify the radius. The polygon is drawn on > mouse up. The number of sides is specified by the "sides" attribute. > > Here's an example. Click the polygon button in the toolbar in the upper > right corner and click and drag to create the polygon. To change the > sides, enter the number of sides you want and click submit. > > http://maps.terratrace.net/mapserver/vmaptest.html > > Attached is the handler code. > > > > The information transmitted is the property of Archetype, Inc. and is > intended only for the person or entity to which it is addressed and may > contain confidential and/or privileged material. Statements and opinions > expressed in this e-mail may not represent those of the company. Any review, > retransmission, dissemination and other use of, or taking of any action in > reliance upon, this information by persons or entities other than the > intended recipient is prohibited. If you received this in error, please > contact the sender immediately and delete the material from any computer. > E-mail transmission cannot be guaranteed to be secured or error-free as > information could be intercepted, corrupted, lost, destroyed, received late > or incomplete, or could contain viruses. The sender therefore does not accept > liability for any error or omission in the contents of this message, which > arises as a result of e-mail transmission. > > > ------------------------------------------------------------------------ > > /** * Handler to draw an N sided regular ploygon on the map. A point is > drawn on mouse down, * a line is drawn on mouse move (representing the > radius), and the polygon is drawn on mouse up. * Use the "sides" option > to set the number of polygon sides. * * @class * @requires > OpenLayers/Handler/Point.js * @requires OpenLayers/Geometry/Polygon.js > */ OpenLayers.Handler.RegularPolygon = OpenLayers.Class.create(); > OpenLayers.Handler.RegularPolygon.prototype = > OpenLayers.Class.inherit(OpenLayers.Handler.Point, { /** * @type > OpenLayers.Feature.Vector * @private */ line: null, /** * @type > OpenLayers.Feature.Vector * @private */ regularPolygon: null, /** * The > number of sides the polygon will have * @type int */ sides: 50, /** * > @constructor * * @param {OpenLayers.Control} control * @param {Array} > callbacks An object with a 'done' property whos value is * a function to > be called when the path drawing is * finished. The callback should > expect to recieve a * single argument, the polygon geometry. * If the > callbacks object contains a 'point' * property, this function will be > sent each point * as they are added. If the callbacks object contains * > a 'cancel' property, this function will be called when * the handler is > deactivated while drawing. The cancel * should expect to receive a > geometry. * @param {Object} options */ initialize: function(control, > callbacks, options) { > OpenLayers.Handler.Point.prototype.initialize.apply(this, arguments); }, > /** * Add temporary geometries */ createFeature: function() { this.line > = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString()); > this.point = new OpenLayers.Feature.Vector(new > OpenLayers.Geometry.Point()); this.regularPolygon = new > OpenLayers.Feature.Vector(new OpenLayers.Geometry.Polygon()); }, /** * > Destroy temporary geometries */ destroyFeature: function() { > this.line.destroy(); this.point.destroy(); > this.regularPolygon.destroy(); this.line = null; this.regularPolygon = > null; }, /** * Modify the existing geometry given the new point * */ > modifyFeature: function() { var index = > this.line.geometry.components.length - 1; > this.line.geometry.components[index].x = this.point.geometry.x; > this.line.geometry.components[index].y = this.point.geometry.y; }, /** * > Render geometries on the temporary layer. */ drawFeature: function() { > this.layer.drawFeature(this.line, this.style); > this.layer.drawFeature(this.point, this.style); }, /** * Add point to > geometry. Send the point index to override * the behavior of LinearRing > that disregards adding duplicate points. */ addPoint: function() { > this.line.geometry.addComponent(this.point.geometry.clone(), > this.line.geometry.components.length); this.callback("point", > [this.point.geometry]); }, /** * Return a clone of the relevant > geometry. * * @type OpenLayers.Geometry.LineString */ geometryClone: > function() { return this.regularPolygon.geometry.clone(); }, > createRegularPolygon: function() { var pointList = []; // the radius is > the length of the line segment var radius = > this.line.geometry.getLength(); // draw the polygon, the center is the > first point drawn at mousedown if (radius > 0) { var cenx = > this.line.geometry.components[0].x; var ceny = > this.line.geometry.components[0].y; var piNum = Math.PI * 2; var > segments = piNum / this.sides; for (var a = 0; a < piNum; a += segments) > { var x = cenx + radius * Math.sin(a); var y = ceny + radius * > Math.cos(a); var newPoint = new OpenLayers.Geometry.Point(x,y); > pointList.push(newPoint); } pointList.push(pointList[0]); var linearRing > = new OpenLayers.Geometry.LinearRing(pointList); > this.regularPolygon.geometry.addComponent(linearRing); } }, /** * Return > the radius of the polygon * * @type int */ getRadius: function() { > this.line.geometry.getLength(); }, /** * Handle mouse down. Add the > starting (center) point of the polygon and render it * Return determines > whether to propagate the event on the map. * * @param {Event} evt * > @type Boolean */ mousedown: function(evt) { if(this.line == null) { > this.createFeature(); } this.mouseDown = true; var lonlat = > this.control.map.getLonLatFromPixel(evt.xy); this.point.geometry.x = > lonlat.lon; this.point.geometry.y = lonlat.lat; this.addPoint(); > this.drawFeature(); return false; }, /** * Handle mouse move. Adjust the > geometry and redraw the line. * Return determines whether to propagate > the event on the map. * * @param {Event} evt * @type Boolean */ > mousemove: function (evt) { if ((this.line == null) || > (this.line.geometry == null)) return true; > if(this.line.geometry.components.length > 0) { var lonlat = > this.map.getLonLatFromPixel(evt.xy); if > (this.line.geometry.components.length == 1) { this.point = new > OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point()); > this.addPoint(); } this.point.geometry.x = lonlat.lon; > this.point.geometry.y = lonlat.lat; this.modifyFeature(); > this.drawFeature(); } return false; }, /** * Handle mouse up. Send the > last point in the geometry to the control. If we * have a valid line > segment (radius), then draw the polygon. * Return determines whether to > propagate the event on the map. * * @param {Event} evt * @type Boolean > */ mouseup: function (evt) { this.mouseDown = false; if > (this.line.geometry.components.length == 2) { > this.createRegularPolygon(); } this.point.destroy(); > this.line.destroy(); this.finalize(); return false; }, /** @final @type > String */ CLASS_NAME: "OpenLayers.Handler.RegularPolygon" }); > > > ------------------------------------------------------------------------ > > _______________________________________________ > Users mailing list > [email protected] > http://openlayers.org/mailman/listinfo/users _______________________________________________ Users mailing list [email protected] http://openlayers.org/mailman/listinfo/users
