2016-01-02 21 views
0

我正在閱讀這個入門https://aerotwist.com/tutorials/getting-started-with-three-js/我在做什麼錯,ReferenceError:sphereMaterial沒有定義,下面開始

我收到以下錯誤消息,

的ReferenceError:sphereMaterial沒有定義

,而不是一個球應該顯示出來。

什麼我是http://threejs.org/build/three.min.js

<!doctype html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
     <title>Try</title> 
    </head> 
    <body> 
     <div id="scene"><p>yo</p></div> 

<script src="three.min.js"></script> 
<script src="main.js"></script> 
    </body> 
</html> 

main.js

// set the scene size 
var WIDTH = 400, 
    HEIGHT = 300; 

// set some camera attributes 
var VIEW_ANGLE = 45, 
    ASPECT = WIDTH/HEIGHT, 
    NEAR = 0.1, 
    FAR = 10000; 


// create a WebGL renderer, camera 
// and a scene 
var renderer = new THREE.WebGLRenderer(); 
var camera = 
    new THREE.PerspectiveCamera(
    VIEW_ANGLE, 
    ASPECT, 
    NEAR, 
    FAR); 

var scene = new THREE.Scene(); 

// add the camera to the scene 
scene.add(camera); 

// the camera starts at 0,0,0 
// so pull it back 
camera.position.z = 300; 

// start the renderer 
renderer.setSize(WIDTH, HEIGHT); 

// attach the render-supplied DOM element 
document.getElementById("scene").appendChild(renderer.domElement); 

// set up the sphere vars 
var radius = 50, 
    segments = 16, 
    rings = 16; 

// create a new mesh with 
// sphere geometry - we will cover 
// the sphereMaterial next! 
var sphere = new THREE.Mesh(

    new THREE.SphereGeometry(
    radius, 
    segments, 
    rings), 

    sphereMaterial); 

// add the sphere to the scene 
scene.add(sphere); 

回答

2

好三個副本,你似乎並不被關注的教程。你的JS顯然缺乏任何變量,名爲sphereMaterial,並您搜索您的教程該變量,你會看到這一段代碼,你沒有複製到你的腳本:

// create the sphere's material 
var sphereMaterial = 
    new THREE.MeshLambertMaterial(
    { 
     color: 0xCC0000 
    });