[OpenLayers-Users] ModifyFeature: Rotate Center Point and Control Point

[carls]

I just try to do some modification to ModifyFeature.js and Geometry.js.
 
 one function 'GetCenter()' is added to OpenLayers.Geometry, and a little
modification is applied to 'collectDragHandle' and 'collectRadiusHandle' of
ModifyFeature.js.
 
for Geometry.js:
 
 
GetCenter: function() {
        var vertices = new Array();
        var center = new OpenLayers.Geometry.Point(0, 0);
        var xx = 0, yy = 0;
        /**
        * Method: Collect All Vertices
        */
        function collectAllVertices(geometry, vertices) {
            var i, vertex, component, len;
            if (geometry.CLASS_NAME == "OpenLayers.Geometry.Point") {
                vertex = new OpenLayers.Feature.Vector(this);
                vertices.push(vertex);
            } else {
                var numVert = geometry.components.length;
                if (geometry.CLASS_NAME == "OpenLayers.Geometry.LinearRing")
{
                    numVert -= 1;
                }
                for (i = 0; i < numVert; ++i) {
                    component = geometry.components[i];
                    if (component.CLASS_NAME == "OpenLayers.Geometry.Point")
{
                        vertex = new OpenLayers.Feature.Vector(component);
                        vertices.push(vertex);
                    } else {
                        collectAllVertices(component, vertices);
                    }
                }
            }
        }
        
        collectAllVertices(this,vertices);
        if (vertices.length > 0) {
            for (ii in vertices) {
                xx += vertices[ii].geometry.x;
                yy += vertices[ii].geometry.y;
            }
            center = new OpenLayers.Geometry.Point(xx / vertices.length, yy
/ vertices.length);
        }
        return center;
    },
 
 
for ModifyFeature.js:
 
/**
    * Method: collectDragHandle
    * Collect the drag handle for the selected geometry.
    */
    collectDragHandle: function() {
        var geometry = this.feature.geometry;
        ///var center = geometry.getBounds().getCenterLonLat();
        //var originGeometry = new OpenLayers.Geometry.Point(
        //    center.lon, center.lat
        //);
        var originGeometry = geometry.GetCenter();
        var origin = new OpenLayers.Feature.Vector(originGeometry);
        originGeometry.move = function(x, y) {
            OpenLayers.Geometry.Point.prototype.move.call(this, x, y);
            geometry.move(x, y);
        };
        this.dragHandle = origin;
        this.layer.addFeatures([this.dragHandle], { silent: true });
    },
    /**
    * Method: collectRadiusHandle
    * Collect the radius handle for the selected geometry.
    */
    collectRadiusHandle: function() {
        var geometry = this.feature.geometry;
        var bounds = geometry.getBounds();
        //var center = bounds.getCenterLonLat();
        //var originGeometry = new OpenLayers.Geometry.Point(
          //  center.lon, center.lat
        //);
        var originGeometry = geometry.GetCenter();
        var radiusGeometry = new OpenLayers.Geometry.Point(
            (bounds.right - originGeometry.x) * 1.3 + originGeometry.x,
(bounds.bottom - originGeometry.y) * 1.3 + originGeometry.y
        );
        
var radius = new OpenLayers.Feature.Vector(radiusGeometry);
        var resize = (this.mode & OpenLayers.Control.ModifyFeature.RESIZE);
        var rotate = (this.mode & OpenLayers.Control.ModifyFeature.ROTATE);
        radiusGeometry.move = function(x, y) {
            OpenLayers.Geometry.Point.prototype.move.call(this, x, y);
            var dx1 = this.x - originGeometry.x;
            var dy1 = this.y - originGeometry.y;
            var dx0 = dx1 - x;
            var dy0 = dy1 - y;
            if (rotate) {
                var a0 = Math.atan2(dy0, dx0);
                var a1 = Math.atan2(dy1, dx1);
                var angle = a1 - a0;
                angle *= 180 / Math.PI;
                geometry.rotate(angle, originGeometry);
            }
            if (resize) {
                var l0 = Math.sqrt((dx0 * dx0) + (dy0 * dy0));
                var l1 = Math.sqrt((dx1 * dx1) + (dy1 * dy1));
                geometry.resize(l1 / l0, originGeometry);
            }
        };
        this.radiusHandle = radius;
        this.layer.addFeatures([this.radiusHandle], { silent: true });
    },



I tested it and it seems can run well. 




carls wrote:
> 
> while using ModifyFeature control on a regular polygon, it can be found
> the rotate center is not right the real center of a regular polygon?  (try
> it with a regular triangle)
> 
> additionally, while rotating and modifying a rectangle parallel to the
> axis, the control point for rotating might be at the same position of the
> right-bottom corner of the rectangle, which confuses the action of
> rotation and modifition, i.e. what i really need is to rotate the
> rectangle, but really I moved the right-bottom corner of it.  This can be
> resolved if the control point becomes a little more far to the center
> point than any vertex of the geometry.
> 
> It is not a big problem. But it will be better if imporved.
> 
> Thanks!
> 


-----
Regards, Carl SHE
-- 
View this message in context: http://n2.nabble.com/ModifyFeature%3A-Rotate-Center-Point-and-Control-Point-tp1394002p1464935.html
Sent from the OpenLayers Users mailing list archive at Nabble.com.