Почему мой код Three.js не работает, когда я его тестирую? - PullRequest
0 голосов
/ 15 июня 2019

Я пробую Three.js, пошагово следую инструкциям. В редакторе кода, который я использую (Visual Studio Code 2019), все выглядит нормально, но когда я тестирую его, на странице ничего не появляется.

редактор, который я использую, использовал рабочий стол как место, где я мог найти свой код, поскольку это HTML-файл, который я мог запустить. Когда я сделал это, единственное, что появилось, это навигационная панель, которую я запрограммировал, ничего больше

This is the entire three.js code:
<script src="three.js-dev/build/three.min.js"> </script>
        <script>
            var scene = new THREE.scene();
            var camera = new THREE.PerspectiveCamera( 75, window.innerWidth/window.innerHeight);

            var renderer = new THREE.WebGLRenderer({antialias = true});
            renderer.setSize( window.innerWidth, window.innerHeight);
            $('body').append( renderer.domElement);

            var geometry = new THREE.BoxGeometry( 1, 1, 1 );
            var material = new THREE.MeshBasicMaterial ( { color = 0xff0000 });
            var cube = new THREE.Mesh( geometry, material) ;
            scene.add( cube );

            cube.position.z = -5;
            var animate = function () {

             cube.rotation.x += 0.01;

                renderer.render(scene, camera);
                requestAnimationFrame( animate );
            };
            animate();

и этот код перед ним:

<html>
        <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
        <script 
        src="https://code.jquery.com/jquery-2.1.4.js"
        integrity="sha256-siFczlgw4jULnUICcdm9gjQPZkw/YPDqhQ9+nAOScE4="
        crossorigin="anonymous"></script>
        </head>
        <body>
        <div id="navbar"><span>Three.js Tut</span></div>

Я ожидал, что вращается красный куб, но ничего не появилось. There Что-то я делаю не так?

1 Ответ

0 голосов
/ 16 июня 2019

В вашем коде есть несколько ошибок:

  • THREE.scene должно быть THREE.Scene
  • {antialias = true} должно быть {antialias: true}
  • { color = 0xff0000 } должно быть { color: 0xff0000 }

Демоверсия с вашим кодом: https://jsfiddle.net/so736vxj/

Кстати: если вы используете VSCode, я немного раздражен тем, что ошибки не выделяются. Особенно о двух последних синтаксических ошибках следует сообщать, поскольку это недопустимый JavaScript.

three.js R105

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...