Question about 5 Bonus Part

#1

Explain how your code is misbehaving:
Hello, i am from Germany and I have a question!
I am in chapter 5 (Bonus 2) and I wanna add a plane, but If it type the code in the 3rd line to add the plane this message comes:

Screenshot (49)
Screenshot (49)1920×1080 148 KB

This is all my code but idk why it stands there :frowning:

// Paste your code here, this is all my code…

// The "scene" is where stuff in our game will happen: var scene = new THREE.Scene(); var flat = {flatShading: true}; var light = new THREE.AmbientLight('white', 0.8); scene.add(light);

// The “camera” is what sees the stuff:
var aspectRatio = window.innerWidth / window.innerHeight;
var camera = new THREE.PerspectiveCamera(75, aspectRatio, 1, 10000);
camera.position.z = 500;
scene.add(camera);

// The “renderer” draws what the camera sees onto the screen:
var renderer = new THREE.WebGLRenderer({antialias: true});
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

// ******** START CODING ON THE NEXT LINE ********
var shape = new THREE.SphereGeometry(50);
var cover = new THREE.MeshBasicMaterial({color: ‘blue’});
var planet = new THREE.Mesh(shape, cover);
planet.position.set(-300, 0, 0);
scene.add(planet);

var shape = new THREE.SphereGeometry(50);
var cover = new THREE.MeshBasicMaterial({color: ‘yellow’});
var planet = new THREE.Mesh(shape, cover);
planet.position.set(200, 0, 250);
scene.add(planet);

function makePlanet() {
var size = r(50);
var x = r(1000) - 500;
var y = r(1000) - 500;
var z = r(1000) - 1000;
var surface = rColor();

var shape = new THREE.SphereGeometry(size);
var cover = new THREE.MeshBasicMaterial({color: surface});
var planet = new THREE.Mesh(shape, cover);
planet.position.set(x, y, z);
scene.add(planet);
}

makePlanet();
makePlanet();

for (var i=0; i<100; i++) {
makePlanet();
}

console.log(Math.random());

function r(max) {
if (max) return max * Math.random();
return Math.random();
}

var randomNum = r();
console.log(randomNum);

randomNum = r(100);
console.log(randomNum);

console.log(r(100));
console.log(r(100));

function rColor() {
return new THREE.Color(r(), r(), r());
}

var controls = new THREE.FlyControls(camera);
controls.movementSpeed = 100;
controls.rollSpeed = 0.5;
controls.dragToLook = true;
controls.autoForward = false;

var clock = new THREE.Clock();
function animate() {
var delta = clock.getDelta();
controls.update(delta);

renderer.render(scene, camera);
requestAnimationFrame(animate);
}
animate();

// Now, show what the camera sees on the screen:
renderer.render(scene, camera);

Include any more information that you like here…
I have the german book, but I hope nothing is that huge of a different!
Have a nice day :smiley:

#2

Looks like some of the code got lost when it was pasted in here. No worries – we may still be able to fix this.

When I pasted your code into my 3DE, it did not work for me either, but I only had to add one thing: the <script> tag at the top of the code:

<script src="/controls/FlyControls.js"></script>

Once I typed that into my 3DE, your code worked perfectly!

So my guess is that you have a small typo in that line. Can you go back and double-check that line? Make sure that there are two less-than symbols (<) and two greater-than symbols (>). Check the spelling of “script”. Make sure there is a slash before the second “script”.

If that is still not working, please paste that line back here. This time, be sure to put three backtick symbols on the line before and after the <script> line:

``` 
<script src="/controls/FlyControls.js"></script>
```

That should get the forum to include all of your code.

-Chris

#3

GolemGon

Yes, I already found the anwser but still ty :slight_smile:
I needed to write

…
< script > under the FlyControls
…

Ty and have a nice day! :smiley: