Блог

Я следую этому руководству YouTube https://www.youtube.com/watch?v=axGQAMqsxdw чтобы создать POV-игру. Я добрался до эпизода 8 учебника, затем Google Chrome начал показывать белый экран, независимо от того, что я изменил в javascript. При проверке кода с помощью инструментов разработчика Chrome также нет никаких предупреждений или проблем.

Я пытался начать с нуля с совершенно новыми файлами. Я очистил кеши для Chrome. Я дважды проверил исходный код с моим измененным кодом, но ни одно из моих изменений не похоже на то, что они могут вызвать проблему (хотя я новичок в javascript, так что это может быть проблемой). Ниже приведен недавно запущенный файл js, основанный на 100% уроке YouTube.

 var scene, camera, renderer, mesh;

function init(){
    scene = new THREE.Scene();
    scene.background = new THREE.Color( 0x8CD9FF );
    camera = new THREE.PerspectiveCamera (90, 1280/720, 0.1, 10);


    mesh = new THREE.Mesh(
        new THREE.BoxGeometry(1,1,1),
        new THREE.MeshBasicMaterial ({color: 0xff9999, wireframe: true})
        );

    scene.add(mesh);

    renderer = new THREE.WebGLRenderer();
    renderer.setSize(1280/720);
    document.body.appendChild(renderer.domElement);

    animate();
}

function animate(){
    requestAnimationFrame(animate);



    renderer.render(scene,camera);
}

window.onload = init;
 

Взгляните на ТРИ документации, касающиеся размера средства визуализации здесь. Вам нужно установить ширину и высоту пикселей, а не соотношение, поэтому попробуйте заменить renderer.setSize(1280/720); на renderer.setSize(1280, 720)