我试图在 Three.js(WEBGL 库)中创建一个碰撞检测“程序”。但是,我收到一个错误“无法调用未定义的方法 multiplyvector3”。
谁能告诉我我做错了什么?
我刚刚实现的碰撞检测功能是:
function animate() {
requestAnimationFrame(animate);
render();
for (var vertexIndex = 0; geometries[0].vertices.length; vertexIndex++)
{
var localVertex = geometries[0].vertices[vertexIndex].clone();
var globalVertex = geometries[0].matrix.multiplyVector3(localVertex);
var directionVector = globalVertex.subSelf(meshes[5].position);
var ray = new THREE.Ray( meshes[5].position, directionVector.clone().normalize() );
var collisionResults = ray.intersectObjects( meshes);
if ( collisionResults.length > 0 && collisionResults[0].distance < directionVector.length() )
{
}
else {
meshes[5].position.y -= 0.15;
meshes[5].rotation.z -= 0.15;
}
}
}
完整的代码是,
<html>
<head>
<script type='text/javascript' src='//cdnjs.cloudflare.com/ajax/libs/three.js/r54/three.min.js'></script>
<script type='text/javascript'>//<![CDATA[
window.onload=function(){
var camera, scene, renderer, material;
var meshes = new Array();
var geometries = new Array();
init();
animate();
function init() {
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 1, 10000);
camera.position.z = 500;
camera.position.x += 125;
scene.add(camera);
geometries[0] = new THREE.CubeGeometry(35, 35, 35);
material = new THREE.MeshNormalMaterial();
geometries[1] = new THREE.SphereGeometry(35, 35, 35);
material = new THREE.MeshNormalMaterial();
for(var i = 0; i < 5; i++) {
meshes[i] = new THREE.Mesh(geometries[0], material);
}
meshes[5] = new THREE.Mesh(geometries[1], material);
for(var i = 0; i < 5; i++) {
meshes[i].position.x = (35*i);
meshes[i].rotation.x = 5;
}
meshes[5].position.y = (100);
for(var i = 0; i < 5; i++) {
scene.add(meshes[i]);
}
scene.add(meshes[5]);
renderer = new THREE.CanvasRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
document.addEventListener("mousemove", onDocumentMouseMove, false);
}
function onDocumentMouseMove(event) {
}
function animate() {
requestAnimationFrame(animate);
render();
for (var vertexIndex = 0; geometries[0].vertices.length; vertexIndex++)
{
var localVertex = geometries[0].vertices[vertexIndex].clone();
var globalVertex = geometries[0].matrix.multiplyVector3(localVertex);
var directionVector = globalVertex.subSelf(meshes[5].position);
var ray = new THREE.Ray( meshes[5].position, directionVector.clone().normalize() );
var collisionResults = ray.intersectObjects( meshes);
if ( collisionResults.length > 0 && collisionResults[0].distance < directionVector.length() )
{
}
else {
meshes[5].position.y -= 0.15;
meshes[5].rotation.z -= 0.15;
}
}
}
function render() {
renderer.render(scene, camera);
}
}//]]>
</script>
</head>
<body>
</body>
</html>
谢谢!