look at
camera为相机看的目标点:因为屏幕显示的是相机视椎体的可视范围,而相机的lookat方法指的是相机观察的目标点,故可以得出:
相机lookAt的点一定显示在屏幕的正中央:利用这点,我们可以实现物体移动时,我们可以一直跟踪物体,让物体永远在屏幕的中央:一下是代码实现
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, Minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>shape对象的研究</title>
<style>
body{
margin:0;
}
</style>
</head>
<script src="../js/three.js"></script>
<script>
function init() {
createScene();
buildAuxSystem();
addBox();
loop();
}
var scene,camera,renderer,width = window.innerWidth,height = window.innerHeight,controls;
var box,x =0 ,z = 0;
function createScene() {
scene = new THREE.Scene;
camera = new THREE.PerspectiveCamera(45,width/height,1,1000);
camera.position.set(200,200,200);
camera.lookAt(scene.position);
renderer = new THREE.WebGLRenderer();
renderer.setClearcolor(new THREE.Color(0x333333),1);
renderer.setSize(width,height);
document.body.APPendChild(renderer.domElement);
document.addeventlistener("keydown",handleKey,false);
window.addEventListener("resize",handleWindowResize,false)
}
function loop() {
renderer.render(scene,camera);
box.position.set(x,5,z);
camera.lookAt(box.position);
requestAnimationFrame(loop);
}
function handleWindowResize() {
width = window.innerWidth;
height = window.innerHeight;
renderer.setSize(width,height);
camera.aspect = width/height;
camera.updateProjectionMatrix();
}
// 建立辅助设备系统
function buildAuxSystem(){
var gridHelper = new THREE.GridHelper(320,32);
scene.add(gridHelper);
var axesHelper = new THREE.AxesHelper(320);
scene.add(axesHelper);
}
function addBox() {
var geometry = new THREE.CubeGeometry(10,10,10);
box = new THREE.Mesh(geometry,new THREE.MeshBasicMaterial({color:0x00ff00}));
box.position.set(x,5,z);
scene.add(box);
}
function handleKey(e) {
if(e.keyCode == 38){
z -= 10;
}else if(e.keyCode == 39){
x += 10;
}else{
return;
}
}
</script>
<body onload ="init()">
</body>
</html>
效果: 当我们按 上 键 物体向上移动 屏幕视角也在移动, 当我们按 右键 物体向右移动, 屏幕也跟着向右移动。这样物体一直在屏幕的中央。相关阅读
Unity3D 的LookAt() 与 LookRotation()方法的比较
LookAt(),定义: 其定义在UnityEngine.Transform类中,public void LookAt(Vector3 worldPosition);public void LookAt(Transform ta