Question

我是OpenLayers 3的新手，我想知道如何旋转多边形。

我认为如果有办法，可以使用applyTransform方法（http://openlayers.org/en/v3.4.0/apidoc/ol.geom.Polygon.html#applyTransform）

为了尝试，我做了这个：

<div class="form-group prevcomments">
    <div class="col-md-12">
        <ul class="media-list">
            <li class="media">
                <a class="pull-left" href="javascript:;">
                <img class="todo-userpic" src="../../assets/admin/layout2/img/avatar8.jpg" width="27px" height="27px">
                </a>
                <div class="media-body todo-comment">
                    <p class="todo-comment-head">
                        <span class="todo-comment-username">John Doe New</span> &nbsp; <span class="todo-comment-date">Jan 1, 1970 at 9:00am</span>
                    </p>
                    <p class="todo-text-color content">
                        <?php echo "new comment is here"?>  
                    </p>
                </div>
            </li>
        </ul>
    </div>
</div>

当我运行它时，我有“TypeError：a不是函数”

Jsfiddle：http://jsfiddle.net/tlebras/qnk86o6j/1/

我正在尝试使用OpenLayers 3做什么？如果是的话，我的方法有什么问题？

由于

Answer 1

我找到了一种方法，我需要定义一个点进行旋转，我选择了多边形的中心。

var points = [[1,0],[1,-6],[-1,-6],[-1,0],[1,0] ];
var polygonCenter=[0,-3];

旋转函数获取数组中每个点的当前角度，并更改该标题以旋转特征。这是一个例子，该功能是将特征旋转50°

var rotate = function (array) {
var rotated=[];
for (var i = 0; i < array.length-1; i++) {
    rotated.push([]);
    var ptx     = array[i][0];
    var pty     = array[i][1];
    var currentRotation     = getRotation(ptx - polygonCenter[0], pty - polygonCenter[1]);
    var length     = Math.sqrt(Math.pow(ptx - polygonCenter[0], 2) + Math.pow(pty -polygonCenter[1], 2));
    var newRotation  = currentRotation + 50;
    rotated[i][0]   = (polygonCenter[0] + length * Math.cos(newRotation));
    rotated[i][1] = (polygonCenter[1] + length * Math.sin(newRotation));
}
rotated.push([]);
rotated[array.length-1][0]=rotated[0][0];
rotated[array.length-1][1]=rotated[0][1];
return rotated;

};

var polygon = new ol.geom.Polygon([rotate(points)]);

这是计算航向

的函数

var getRotation = function(dx, dy) {
    var rot = 0;
    if (dx == 0 && dy == 0) return 0;
    if (dy == 0)
        rot = (dx > 0) ? 0 : Math.PI;
    else if (dx == 0)
        rot = (dy > 0) ? 0.5 * Math.PI : 1.5 * Math.PI;
    else {
        var rot = Math.atan(dy/dx);
        if (dx < 0 && dy > 0) rot += Math.PI;
        if (dx < 0 && dy < 0) rot += Math.PI;
        if (dx > 0 && dy < 0) rot += 2 * Math.PI;
    }
    return rot;
};

jsfiddle：http://jsfiddle.net/tlebras/epyjshj7/2/

在OpenLayers 3中旋转多边形

1 个答案: