var startPoint = {
        x: 0,
        y: 0,
        z: 0
    }


    var endPoint = {
        x: -80,
        y: 0,
        z: 50
    }


    var heightLimit = 20


    var flyTime = 8000


    var lineStyle = {
        color: 0xcc0000,
        linewidth: 2
    }
var aCurve = createFlyLine(startPoint, endPoint, heightLimit, flyTime, lineStyle)
    scene.add(aCurve)

    function createFlyLine(startPoint, endPoint, heightLimit, flyTime, lineStyle) {
        var middleCurvePositionX = (startPoint.x + endPoint.x) / 2
        var middleCurvePositionY = heightLimit
        var middleCurvePositionZ = (startPoint.z + endPoint.z) / 2

        var curveData = new THREE.CatmullRomCurve3([
            new THREE.Vector3(startPoint.x, startPoint.y, startPoint.z),
            new THREE.Vector3(middleCurvePositionX, middleCurvePositionY, middleCurvePositionZ),
            new THREE.Vector3(endPoint.x, endPoint.y, endPoint.z)
        ])
        var curveModelData = curveData.getPoints(50)

        var curveGeometry = new THREE.Geometry()
        curveGeometry.vertices = curveModelData.slice(0, 1)
        var curveMaterial = new THREE.LineBasicMaterial({color: lineStyle.color, linewidth: lineStyle.linewidth})
        var curve = new THREE.Line(curveGeometry, curveMaterial)


        var tween = new TWEEN.Tween({endPointIndex:1})
            .to({endPointIndex:50}, flyTime)

        tween.onUpdate(tweenHandler)

        tween.start()

        return curve

        function tweenHandler() {
            var endPointIndex = Math.ceil(this.endPointIndex)

            var curvePartialData = new THREE.CatmullRomCurve3(curveModelData.slice(0, endPointIndex))
            curve.geometry.vertices = curvePartialData.getPoints(50)
            curve.geometry.verticesNeedUpdate = true
        }
    }

Logo

北京人形旗下天工造物具身智能开源社区,聚焦具身天工与慧思开物两大平台

更多推荐