threeJS开发day02-墙体拉伸

墙体拉伸部分代码如下:

function () {
//contoure,order为判断用户画点方向,逆时针为大于0,顺时针时小于0
    var contour = [], order;
    this.getShapes();//获取草图形状
    var polygons = this.polygons;
    this.polygons = [];

    var points = [], floorPoints = [];
    for (var i = 0; i < polygons.length; i++) {
        for (var j = 0; j < polygons[i].points.length; j++)
            contour.push(new THREE.Vector2(polygons[i].points[j].pointOrigin.x, polygons[i].points[j].pointOrigin.y));
        order = THREE.ShapeUtils.area(contour);//得到绘制方向
        for (var j = 0; j < polygons[i].points.length; j++) {
            var k, a03, a04, cdistance;
            if (j - 1 < 0) {
                k = polygons[i].points.length - 1;
            } else {
                k = j - 1;
            }
            //p、p0、p1为两条连接的三个点
            var p = polygons[i].points[k].point.clone();
            var p0 = polygons[i].points[j].point.clone();
            if (j + 1 >= polygons[i].points.length) {
                k = 0;
            } else {
                k = j + 1;
            }
            var p1 = polygons[i].points[k].point.clone();
            //根据p,p0,p1得出两条线
            var a01 = p.clone().sub(p0.clone());
            var a02 = p1.clone().sub(p0.clone());
            var matrix = new THREE.Matrix4();
            //计算两条线的夹角,《180°
            var angle = Math.acos(a01.clone().normalize().dot(a02.clone().normalize()));
            //当画线形状出现凹凸时会出现问题,此时判断凹凸情况,点在线的上面还是下面,》0在上面,《0在下面
            var dir = ( p1.x - p.x ) * a01.z - (p1.z - p.z) * a01.x;
            //当在下面时,两方旋转方向相反,计算出的两个点也会相反
            if(dir>0)
            {
            //旋转第二条线,旋转夹角的一半以及另一方夹角的一半
                if (order > 0) {
                    matrix.makeRotationY(angle / 2);
                    a03 = a02.clone().applyMatrix4(matrix);
                    matrix.makeRotationY(-(Math.PI - angle / 2));
                    a04 = a02.clone().applyMatrix4(matrix);
                } else {
                    matrix.makeRotationY(-angle / 2);
                    a03 = a02.clone().applyMatrix4(matrix);
                    matrix.makeRotationY(Math.PI - angle / 2);
                    a04 = a02.clone().applyMatrix4(matrix);
                }
                cdistance = (300 / 2) / Math.sin(angle / 2);
                //单位化向量后设置向量的长度使向量到外线的距离为墙体的宽度
                a03.normalize();
                a04.normalize();
                //向量长度相乘
                a03.multiplyScalar(cdistance);
                a04.multiplyScalar(cdistance);
                //得到点并push到数组中
                a03.add(p0);
                a04.add(p0);
                points.push(a03, a04);
            }else{
                if (order > 0) {
                    matrix.makeRotationY(-angle / 2);
                    a03 = a02.clone().applyMatrix4(matrix);
                    matrix.makeRotationY((Math.PI - angle / 2));
                    a04 = a02.clone().applyMatrix4(matrix);
                } else {
                    matrix.makeRotationY(angle / 2);
                    a03 = a02.clone().applyMatrix4(matrix);
                    matrix.makeRotationY(-(Math.PI - angle / 2));
                    a04 = a02.clone().applyMatrix4(matrix);
                }
                cdistance = (300 / 2) / Math.sin(angle / 2);
                a03.normalize();
                a04.normalize();
                a03.multiplyScalar(cdistance);
                a04.multiplyScalar(cdistance);
                a03.add(p0);
                a04.add(p0);
                points.push(a04, a03);
            }

        }
    }
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值