3D Model Rotation On HTML With JS

Referring to this video, I can't seem to see the cube which is supposed to be here. Code causes these 2 errors: DEPRECATED: THREE.CubeGeometry is deprecated. Use THREE.BoxGeometry

Solution 1:

Problem 1: One of your methods namely THREE.CubeGeometry is deprecated, which means you should switch it to what the error suggests: THREE.BoxGeometry. Do:

var geometry = new THREE.BoxGeometry(100,100,100);

Instead of:

var geometry = new THREE.CubeGeometry(100,100,100);

See Three.js referece

Problem 2: On the other error you have a typo. Your're using materials instead of material. Do:

var mesh = new THREE.Mesh( geometry, material);

Instead of:

var mesh = new THREE.Mesh( geometry, materials); 

Solution 2:

Uhm, I believe you just need to remove the 's' of materials in this function call:

   var mesh = new THREE.Mesh( geometry, materials);

You have defined the variable "material", but not "materials", which is what the Uncaught ReferenceError means. And this error is the showstopper.