THREE.js Skybox not working

Question

i am trying to do my own version of a planetarium based on the book Up and running and i am getting a problem when trying to make a skybox.

I am using Chrome and the javascript console bring up an error "Uncaught TypeError: undefined is not a function" in the line where the material is defined.

Am i missing some library? Or is it some change in three.js? I am using r55. The code is the following:

Thank you!

var urlPrefix   = "images/skybox/";
var urls = [ 
urlPrefix + "skyboxmid.jpg", urlPrefix + "skyboxback.jpg",
urlPrefix + "skyboxleft.jpg", urlPrefix + "skyboxfront.jpg",
urlPrefix + "skyboxright.jpg", urlPrefix + "skyboxtop.jpg" ];

var textureCube = THREE.ImageUtils.loadTextureCube( urls );
var shader  = THREE.ShaderLib['normalmap'];
shader.uniforms["tNormal"].texture = textureCube;
var material = new THREE.MeshShaderMaterial({
    fragmentShader  : shader.fragmentShader,
    vertexShader    : shader.vertexShader,
    uniforms    : shader.uniforms
});

skybox  = new THREE.Mesh( new THREE.CubeGeometry( 100000, 100000, 100000, 1, 1, 1, null, true ), material );
scene.addObject( skybox );

WestLangley · Accepted Answer · 2013-02-26 03:39:54Z

10

It is now

new THREE.ShaderMaterial()

and

shader.uniforms["tNormal"].value = textureCube;

The Up and Running book you are using is out of date.

Search the three.js examples directory instead. There are other ways of creating skyboxes.

three.js r.55

edited Feb 26, 2013 at 3:39

answered Feb 8, 2013 at 16:08

WestLangley

105k11 gold badges288 silver badges285 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

THREE.js Skybox not working

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related