cesium绘制多边形重叠不规则问题，并返回矩形经纬度及面积

最新推荐文章于 2023-08-15 14:14:36 发布

钢镚是个小屁精

最新推荐文章于 2023-08-15 14:14:36 发布

阅读量2k

点赞数 3

分类专栏： cesium 文章标签： javascript

本文链接：https://blog.csdn.net/qq_39262418/article/details/120285689

版权

使用Cesium结合Turf库，通过判断移动点与已存在多边形边界的交叉情况，确保绘制的多边形不出现重叠或不规则现象。当线段交叉点超过1时，表明绘制的多边形不符合规则。

摘要由CSDN通过智能技术生成

cesium+turf解决绘制多边形不规则问题

思路：绘制多边形时，使用移动点与已确定点的开始点及结束点组成两条线，使用turf的lineIntersect判断这两天线与已确定线是否有交点，由于开始点与结束点时共同点，所以判断交点是否大于1，有交点则多边形不规则，不允许绘制。

turf有booleanCrosses可以判断是否有焦点，但是我在使用的时候发现有交点的两条线也返回false，所以使用了lineIntersect

代码如下：

   // 绘制多边形
    function drawPolygon(whetherStart) {
        if (viewer) {
            if (whetherStart) {
                let whetherPoint = true
                // 清除以前
                removeEntityByName('drawPolygon')
                removeEntityByName('drawPolygonPoint')

                var activeShapePoints = [];//点
                var activeShape;//动态图形
                var floatingPoint;

                viewer.screenSpaceEventHandler.setInputAction(function (movement) {
                    const earthPosition = viewer.camera.pickEllipsoid(movement.position, viewer.scene.globe.ellipsoid);//当前世界坐标笛卡尔积
                    if (Cesium.defined(earthPosition)) {
                        if (whetherPoint) {//是否可以点点
                            if (activeShapePoints.length === 0) {//没有点/开始绘制
                                floatingPoint = createPoint(earthPosition);//绘制点
                                activeShapePoints.push(earthPosition);//添加点
                                var dynamicPositions = new Cesium.CallbackProperty(function () {//使用callback,activeShapePoints变化会重新生成新的多边形并绘制
                                    return new Cesium.PolygonHierarchy(activeShape