javascript - gsap 代码中的时间变量未更新

标签 javascript three.js gsap

因此,我在 Three.js 中获取对象的 Y 位置(高度),然后用它更新 greensock 时间变量。它正在登录控制台,但不更新 greensock 中的变量。我究竟做错了什么?当我向时间变量添加一个数字而不是 null 时,它工作得很好,但我想以编程方式控制立方体的着陆速度。

Here's a plunker

相关的JS如下:

  function flyDown(){
    getFlyPosition();
    TweenLite.to(cube.position , flyTime, {y: 25, ease:Sine.easeInOut} );
  }

  var flyTime = null;


  function getFlyPosition(){
    scene.updateMatrixWorld(true);
    var position = new THREE.Vector3();
    position.getPositionFromMatrix( cube.matrixWorld );
    flyTime = Math.round(position.y/3);
    console.log(flyTime);
  }

最佳答案

并不是说它不起作用,只是你的 FlyTime 非常高,因为时间以秒为单位(因此它正在下降,只是非常非常慢)。

根据具体情况,我发现飞行时间在 35 到 70 左右之间。我不确定您的目标是什么,但我的猜测是您实际上希望将飞行时间划分为毫秒级别。

看看这个。我把 0.2 作为你的时间值,我让它“下降”。看起来您需要做的就是除以 FlyTime 或从某个版本中减去它。再说一遍,我不确定您想要什么速度。

  function flyDown(){
    getFlyPosition();
    console.log(flyTime);
    TweenLite.to(cube.position , .2, {y: 25, ease:Sine.easeInOut} );
  }

        var flyTime = null;


        function getFlyPosition(){
   scene.updateMatrixWorld(true);
    var position = new THREE.Vector3();
    position.getPositionFromMatrix( cube.matrixWorld );
    flyTime = Math.round(position.y/3);
    console.log(flyTime);
  }

http://plnkr.co/edit/MEXRiovDI2RMPaUKza4e?p=preview

关于javascript - gsap 代码中的时间变量未更新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31997147/

相关文章:

javascript - Threejs克隆方法

javascript - 如何使用旋转找出旋转梯形的边界框

javascript - 使用 GSAP 和 TweenMax 同时触发多个补间

javascript - 仅包含空格和字母的正则表达式?

javascript - Google Chart BarChart 上的居中条形图?

javascript - 当 Javascript 更改输入值时更新可观察对象

javascript - 如何使用 Three.js 中的回调异步加载多个纹理?

javascript - 如何解释 Chrome 内存分析结果、内存分配时间线 - GSAP Tween 内存泄漏

javascript - 如何在 jquery 中为对象键创建一个工作变量以避免额外的代码

javascript - Protractor :WAITING自定义事件的最佳方式