无法在Three.js中初始化dat.GUI

Question

当我运行代码时，在此行中出现以下错误：

var gui = new dat.GUI();

错误：无法获取'getItem'属性的空引用或未定义。

我导入了库，不知道出了什么问题，这是我的代码：

<html>
    <head>
        <title>Stack Overflow</title>
        <style>
            body { margin: 0; }
            canvas { width: 100%; height: 100% }
        </style>
    </head>
    <body>
        <div id="container"></div>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
        <script src="js/three.min.js"></script>
        <script src="js/optimer_regular.typeface.js"></script>
        <script src="js/TrackballControls.js"></script>
        <script src="js/stats.min.js"></script>
        <script src="js/threex.dynamictexture.js"></script>
        <script src="js/dat.gui.min.js"></script>
        <script>
            //Basic Three components
            var scene = new THREE.Scene();
            camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 0.1, 1000 );
            //position camera
            camera.position.z = 700;
            //Set camera controls
            var controls = new THREE.TrackballControls( camera );
            controls.rotateSpeed = 1.0;
            controls.zoomSpeed = 1.2;
            controls.panSpeed = 0.8;

            controls.noZoom = false;
            controls.noPan = false;

            controls.staticMoving = true;
            controls.dynamicDampingFactor = 0.3;

            controls.keys = [ 65, 83, 68 ];

            //Set the renderer
            var renderer = new THREE.WebGLRenderer( { antialias: false } );
            renderer.setSize( window.innerWidth, window.innerHeight );
            document.body.appendChild( renderer.domElement );


            //Set the lights
            var light;
            scene.add( new THREE.AmbientLight( 0x404040 ) );

            light = new THREE.DirectionalLight( 0xffffff );
            light.position.set( 0, 1, 1 );
            scene.add( light );

            //Let's add a cute cube
            var object;
            var map = THREE.ImageUtils.loadTexture( 'images/UV_Grid_Sm.jpg' );
            map.wrapS = map.wrapT = THREE.RepeatWrapping;
        map.anisotropy = 16;

            var material = new THREE.MeshLambertMaterial( { ambient: 0xbbbbbb, map: map, side: THREE.DoubleSide } );

            object = new THREE.Mesh( new THREE.BoxGeometry( 100, 100, 100, 4, 4, 4 ), material );
            object.position.set( 400, 20, 50 );
            scene.add( object );

            //Let's add a GUI
            var API = {
                'show model'    : true,
                'show skeleton' : false
            };

            var gui = new dat.GUI();



            function animate() {
                 requestAnimationFrame( animate );
                 render();
            }


            //Render scene
            function render() {
                controls.update();
                renderer.render( scene, camera );
            }


            animate();
        </script>
    </body>
</html>

Answer 1

解决方案：不要使用Internet Explorer，我在Firefox中运行相同的代码，并且可以正常工作。

无法在Three.js中初始化dat.GUI

问题描述

1 个解决方案

解决方案1
0 已采纳 2015-01-30 15:37:57

无法在Three.js中初始化dat.GUI

问题描述

1 个解决方案

解决方案1 0 已采纳 2015-01-30 15:37:57

解决方案1
0 已采纳 2015-01-30 15:37:57