我目前正在制作一个简单的随机生成的小型迷宫游戏,它在上一次会议上运行良好。突然间,当我重新开始尝试集成OBJ加载时,我的场景将不再渲染。我尝试删除它在破坏之前所做的所有事情,现在我有这个奇怪的错误,除非我的代码中有一个ReferenceError它根本不会渲染。
<html>
<head>
<title>MazeGamer 2.0</title>
<meta charset="UTF-8">
<link rel="icon" type="image/png" href="./favicon.png">
<script type="text/javascript" src="js/three.js-master/build/three.js"></script>
<script type="text/javascript" src="js/glcode.js"></script>
<script type="text/javascript" src="js/mazeGen.js"></script>
<script type="text/javascript" src="js/Tree.js"></script>
<script type="text/javascript" src="js/util.js"></script>
<script type="text/javascript" src="js/scene.js"></script>
<script type="text/javascript" src="js/keyPress.js"></script>
<script type="text/javascript" src="js/input.js"></script>
<script type="text/javascript" src="js/main.js"></script>
<style>
body { margin: 0; background-color: black; }
canvas { width: 100%; height: 100%;}
</style>
</head>
<body>
<script>
var width = 3;
var height = 3;
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera( 90, window.innerWidth/window.innerHeight, 0.1, 1000 );
var renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
document.body.addEventListener("keydown",keypress_calls);
renderer.domElement.addEventListener("click", on_click);
window.addEventListener("resize",resizeWindow);
var web_scene = new SCENE(scene,camera,renderer,width,height);
scene = web_scene.setup();
// var billboard;
// for(var i = 0; i < scene.children.length; i++)
// {
// if(scene.children[i].name === "billboard")
// {
// billboard = scene.children[i];
// }
// }
var render = function () {
requestAnimationFrame( render );
renderer.render(scene, camera);
billboard.rotation.y = camera.rotation.y; //this line is the one that determines whether my scene renders or not and I have no idea why
gamePadInput();
};
render();
</script>
</body>
正如您所看到的,注释行应该是一个ReferenceError,因为它使用了一个未实例化的变量,即:
index.html:52 Uncaught ReferenceError: billboard is not defined
当我注释掉该行时,并且在我的控制台中没有报告错误时,我的场景完全是空白的。老实说,为什么会发生这种情况,我感到困惑和慌乱。任何建议都将不胜感激。
编辑#1
//the following is in the file input.js
var buttonList = {};
var gamepad;
function gamePadInput(){
if(gamepad === undefined){
gamepad = navigator.getGamepads()[0];
}
if(navigator.getGamepads()[0] !== undefined){
buttonList.a = gamepad.buttons[0].pressed;
buttonList.b = gamepad.buttons[1].pressed;
buttonList.x = gamepad.buttons[2].pressed;
buttonList.y = gamepad.buttons[3].pressed;
buttonList.rb = gamepad.buttons[5].pressed;
buttonList.lb = gamepad.buttons[4].pressed;
buttonList.rt = gamepad.buttons[7];
buttonList.lt = gamepad.buttons[6];
buttonList.l3 = gamepad.buttons[10].pressed;
buttonList.r3 = gamepad.buttons[11].pressed;
buttonList.u = gamepad.buttons[12].pressed;
buttonList.d = gamepad.buttons[13].pressed;
buttonList.l = gamepad.buttons[14].pressed;
buttonList.r = gamepad.buttons[15].pressed;
buttonList.sel = gamepad.buttons[8].pressed;
buttonList.strt = gamepad.buttons[9].pressed;
buttonList.lxAxis = (Math.abs(gamepad.axes[0]) <= 0.25) ? 0 : gamepad.axes[0];
buttonList.lyAxis = (Math.abs(gamepad.axes[1]) <= 0.25) ? 0 : gamepad.axes[1];
buttonList.rxAxis = (Math.abs(gamepad.axes[2]) <= 0.20) ? 0 : gamepad.axes[2];
buttonList.ryAxis = (Math.abs(gamepad.axes[3]) <= 0.20) ? 0 : gamepad.axes[3];
}
if(buttonList.rxAxis !== 0)
{
camera.rotation.y += (buttonList.rxAxis * -0.0625);
}
if(buttonList.lxAxis !== 0)
{
camera.translateX(buttonList.lxAxis * 0.0625);
}
if(buttonList.lyAxis !== 0)
{
camera.translateZ(buttonList.lyAxis * 0.0625);
}
if(buttonList.d){
console.log("reset");
}
return buttonList;
};