Three.js开发教程(threejs-cookbook):20、指向其他物体
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>20_指向其他物体</title>
<link href="../css/index.css" rel="stylesheet" />
<script src="../libs/three.js"></script>
<script src="../libs/dat.gui.min.js"></script>
</head>
<body>
<script>
var scene = new THREE.Scene();
var renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setClearColor(0x000000, 1.0);
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
var camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 10000);
camera.position.set(50, 50, 50);
camera.lookAt(scene.position);
var geometry = new THREE.BoxGeometry(2, 10, 2);
var material = new THREE.MeshBasicMaterial({ color: 0x0000ff });
var box = new THREE.Mesh(geometry, material);
scene.add(box);
box.rotation.x = Math.PI / 2;
var geometry = new THREE.SphereGeometry(3, 120, 120);
var material = new THREE.MeshBasicMaterial({ color: 0xff0000 });
var sphere = new THREE.Mesh(geometry, material);
scene.add(sphere);
sphere.position.y = 15;
var render = function () {
requestAnimationFrame(render);
renderer.render(scene, camera);
}
var controls = new function () {
this.pointSphere = function () {
box.lookAt(sphere);
};
};
var gui = new dat.GUI();
gui.add(controls, 'pointSphere');
render();
</script>
</body>
</html>
最后更新于1年前
本文由人工编写,AI优化,转载请注明原文地址: Three.js开发教程(threejs-cookbook):20、指向其他物体
推荐阅读
Three.js开发教程(threejs-cookbook)
1582025-01-12
IntelliJ IDEA常见问题解决方案大全:服务面板、Maven报错、启动故障处理
3452026-04-14
GeoServer连接达梦数据库完整指南:空间数据配置与常见问题解决
262026-04-15
Windows系统PyTorch安装教程:CUDA 12.1环境配置与TorchText版本兼容性指南
24452025-10-08
程序员常用技术大全:从编程语言到开发工具完整指南
4922025-10-19
VMware Workstation 16激活码及许可证密钥获取方法
25642025-10-26