Question

我的代码如下。当我取消注释来自object.rotation.y += ( targetRotation - object.rotation.y ) * 0.05;或render()函数的animate()我收到"Uncaught ReferenceError: object is not defined "错误。

我尝试过任何事情，我的animate()函数甚至在加载程序回调中，我尝试将three.js更改为旧版本（目前使用的是r59），希望var object = event.content;可以解决它，没有效果。< / p>

我想添加“点击并移动鼠标以旋转模型”的可用性，我的立方体时没有问题。

但它只适用于我的* obj。

帮助？ =）

        var scene, camera, renderer, loader, ambient, directionalLight;

        var windowHalfX = 300;
        var windowHalfY = 145;

        var targetRotation = 0;
        var targetRotationOnMouseDown = 0;

        var mouseX = 0;
        var mouseXOnMouseDown = 0;

        init();

        function init() {
            container = document.createElement( 'div' );
            document.getElementById("3dbox").appendChild(container);

            scene = new THREE.Scene();
            camera = new THREE.PerspectiveCamera( 45, 600 / 290, 0.1, 1000 );
            //camera.position.set( -15, 10, 15 );
            renderer = new THREE.WebGLRenderer();

            renderer.setSize( 600, 290 );
            container.appendChild( renderer.domElement );

            // MODEL
            var loader = new THREE.OBJMTLLoader();
            loader.addEventListener( 'load', function ( event ) {
                var object = event.content;
                scene.add( object );
                animate();
            });
            loader.load( '<?php bloginfo('template_directory'); ?>/obj/female02.obj', '<?php bloginfo('template_directory'); ?>/obj/female02.mtl' );

            camera.position.z = 100;
            camera.position.y = 10;

            ambient = new THREE.AmbientLight( 0x101030 );
            scene.add( ambient );

            directionalLight = new THREE.DirectionalLight( 0xffeedd );
            directionalLight.position.set( 0, 0, 1 );
            scene.add( directionalLight );

            document.addEventListener( 'mousedown', onDocumentMouseDown, false );
            document.addEventListener( 'touchstart', onDocumentTouchStart, false );
            document.addEventListener( 'touchmove', onDocumentTouchMove, false );
        }

        function render() {
            //object.rotation.y += ( targetRotation - object.rotation.y ) * 0.05;
            renderer.render(scene, camera);
        }

        function animate() {
            //object.rotation.y += ( targetRotation - object.rotation.y ) * 0.05;
            requestAnimationFrame( animate );
            render();
        }

        function onDocumentMouseDown( event ) {

            event.preventDefault();

            document.addEventListener( 'mousemove', onDocumentMouseMove, false );
            document.addEventListener( 'mouseup', onDocumentMouseUp, false );
            document.addEventListener( 'mouseout', onDocumentMouseOut, false );

            mouseXOnMouseDown = event.clientX - windowHalfX;
            targetRotationOnMouseDown = targetRotation;

        }

        function onDocumentMouseMove( event ) {

            mouseX = event.clientX - windowHalfX;

            targetRotation = targetRotationOnMouseDown + ( mouseX - mouseXOnMouseDown ) * 0.02;

        }

        function onDocumentMouseUp( event ) {

            document.removeEventListener( 'mousemove', onDocumentMouseMove, false );
            document.removeEventListener( 'mouseup', onDocumentMouseUp, false );
            document.removeEventListener( 'mouseout', onDocumentMouseOut, false );

        }

        function onDocumentMouseOut( event ) {

            document.removeEventListener( 'mousemove', onDocumentMouseMove, false );
            document.removeEventListener( 'mouseup', onDocumentMouseUp, false );
            document.removeEventListener( 'mouseout', onDocumentMouseOut, false );

        }

        function onDocumentTouchStart( event ) {

            if ( event.touches.length === 1 ) {

                event.preventDefault();

                mouseXOnMouseDown = event.touches[ 0 ].pageX - windowHalfX;
                targetRotationOnMouseDown = targetRotation;

            }

        }

        function onDocumentTouchMove( event ) {

            if ( event.touches.length === 1 ) {

                event.preventDefault();

                mouseX = event.touches[ 0 ].pageX - windowHalfX;
                targetRotation = targetRotationOnMouseDown + ( mouseX - mouseXOnMouseDown ) * 0.05;

            }

        }

Answer 1

这是因为“object”是回调函数中的局部变量。在全球范围内进行评估：

var object;

然后在你的回调中，

object = event.content;

three.js r.59

Three.js，OBJLoader - ＆gt;未捕获的ReferenceError：未定义对象

1 个答案: