【问题标题】:Correct camera movement on finger drag手指拖动时正确的相机移动
【发布时间】:2014-05-10 06:36:55
【问题描述】:

我有一个带地球网格的threejs 场景和一个当用户在屏幕上拖动时必须围绕它旋转的相机。我现在似乎在修复相机旋转的过程中发现了一个完全的僵局:它确实围绕地球网格旋转,但不知何故 z 轴的行为不正确并导致缩放时出现狂野的行为。

Here's the problematic scene in question

【问题讨论】:

    标签: 3d three.js geometry


    【解决方案1】:

    我猜在某个地方存在一个错误,它正在创建一个椭圆轨道,所以你会得到变焦的印象,但实际上相机只是在离球体越来越近。无论是在计算中还是来自hammer.js 是否有一些奇怪的东西(我对此并不熟悉) - 我不确定。

    但是,如果您试图让相机进入轨道,则使用 three.js 扩展名“OrbitControls.js”可能会更好,它似乎为您完成了大部分数字运算。有关演示,请参见以下链接。 https://github.com/mrdoob/three.js/blob/master/examples/misc_controls_orbit.html

    【讨论】:

    • Hammer.js 仅用于确定用户何时在屏幕上滑动/拖动以及他所做的方向。我忽略了阻力的“长度”,只是使用它的正值或负值来相应地改变速度的值。我会看看你的轨道建议,谢谢。
    • 好的,所以这是您用于计算轨道的方法的问题。我看的越多,它看起来越像轨道甚至可能是方形的,并且在角落处最大程度地缩小。当它到达最远点时肯定会出现明显的“反弹”,并且您的代码中也没有我认为需要的三角函数。
    • 我的笔记本草图假设改变运动乘数足以实现水平轨道。如果我正确移动 x 和 z,我应该能够实现正确的轨道运动。
    • 您的假设不正确,该方法可能是创建一个正方形或至少是角轨道。如果您想检查,请使用电子表格进行模拟。几乎所有代码中的旋转计算都应该使用弧度。如果你想修正模型,我建议阅读这篇关于计算旋转的帖子:stackoverflow.com/questions/11363170/…。但我强烈建议你使用 Orbit 控件来处理三个.js 的确切问题,看看这个:codepen.io/nireno/pen/cAoGI
    • 我会在有时间的时候检查您链接到的笔记,本着纠正错误的精神,但将使用 Orbit 进行生产。谢谢。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多