我想在(0, 0, 0)
看点的同时在 yz 平面上绕 x 轴旋转相机。事实证明,该lookAt
函数的行为很奇怪。旋转 180° 后,几何图形意外跳到另一侧。您能否解释一下为什么会发生这种情况,以及如何避免这种情况?
你可以在 jsFiddle 上看到现场演示:http: //jsfiddle.net/ysmood/dryEa/
class Stage
constructor: ->
window.requestAnimationFrame =
window.requestAnimationFrame or
window.webkitRequestAnimationFrame or
window.mozRequestAnimationFrame
@init_scene()
@make_meshes()
init_scene: ->
@scene = new THREE.Scene
# Renderer
width = window.innerWidth;
height = window.innerHeight;
@renderer = new THREE.WebGLRenderer({
canvas: document.querySelector('.scene')
})
@renderer.setSize(width, height)
# Camera
@camera = new THREE.PerspectiveCamera(
45, # fov
width / height, # aspect
1, # near
1000 # far
)
@scene.add(@camera)
make_meshes: ->
size = 20
num = 1
geo = new THREE.CylinderGeometry(0, size, size)
material = new THREE.MeshNormalMaterial()
mesh = new THREE.Mesh(geo, material)
mesh.rotation.z = Math.PI / 2
@scene.add(mesh)
draw: =>
angle = Date.now() * 0.001
radius = 100
@camera.position.set(
0,
radius * Math.cos(angle),
radius * Math.sin(angle)
)
@camera.lookAt(new THREE.Vector3())
@renderer.render(@scene, @camera)
requestAnimationFrame(@draw)
stage = new Stage
stage.draw()