Projekte mit JavaScript

Projekte mit JavaScript 

Dieses Projekt wird von http://youtube-spiele.bplaced.net Entwickelt

Dies ist ein Ausschnitt aus den Projekt was wir Entwickeln. P.S.: Dieser Ausschnitt ist nur ein Beispiel
Programmieren mit JavaScript

Falls es nicht Funktioniert das hier eine Animation zu finden ist den Klick hier und über diesen Butten mit den 3 Strichen, können Sie auf New eine neuen Editor öffnen.
Nur noch einen neuen Namen und schon könnt Ihr den Code kopieren und einfügen.


 // ******** START CODING ON THE NEXT LINE ********
Kannst du den den Code hinein Kopieren.

var marker = new THREE.Object3D();
scene.add(marker);

var cover = new THREE.MeshBasicMaterial({color: 0x000000});
var body = new THREE.SphereGeometry(100);
var avatar = new THREE.Mesh(body, cover);

marker.add(avatar);

var hand =new THREE.SphereGeometry(50);
var right_hand = new THREE.Mesh(hand, cover);
right_hand.position.set(-150, 0, 0);
avatar.add(right_hand);

var left_hand = new THREE.Mesh(hand, cover);
left_hand.position.set(150, 0, 0);
avatar.add(left_hand);

var foot = new THREE.SphereGeometry(50);
var right_foot = new THREE.Mesh(foot, cover);
right_foot.position.set(-75, -125, 0);
avatar.add(right_foot);

var left_foot = new THREE.Mesh(foot, cover);
left_foot.position.set(75, -125, 0);
avatar.add(left_foot);

marker.add(camera);

// Bäume
makeTreeAt( 500, 0);
makeTreeAt( -500, 0);
makeTreeAt( 750, -1000);
makeTreeAt( -750, -1000);
function makeTreeAt(x, z) {
  var trunk = new THREE.Mesh(
    new THREE.CylinderGeometry(50, 50, 200),
    new THREE.MeshBasicMaterial({color: 0xA0522D})
    );
  var top = new THREE.Mesh(
    new THREE.SphereGeometry(150),
    new THREE.MeshBasicMaterial({color: 0x228B22})
    );
    top.position.y = 175;
    trunk.add(top);
    trunk.position.set(x, -75, z);
    scene.add(trunk);
}

 // Jetzt animiere, was die Kamera auf dem Bildschirm sieht:
var is_cartwheeling = false;
var is_flipping = false;
function animate() {
  requestAnimationFrame(animate);
if (is_cartwheeling) {
  avatar.rotation.z = avatar.rotation.z + 0.05;
}
if (is_flipping) {
  avatar.rotation.y = avatar.rotation.y + 0.05;
}

  renderer.render(scene, camera);
}
animate();
//Auf Tastendruckergebisse lauschen
document.addEventListener('keydown', function(event) {
  var code = event.keyCode;
  if (code == 65) marker.position.x = marker.position.x-5; //A
  if (code == 87) marker.position.z = marker.position.z-5; //W
  if (code == 68) marker.position.x = marker.position.x+5; //D
  if (code == 83) marker.position.z = marker.position.z+5; //S
  if (code == 67) is_cartwheeling = !is_cartwheeling; // C
  if (code == 70) is_flipping = !is_flipping; //F
});

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


Und lasse dich Überraschen.
Wenn alles Gut ging haben sie eine kleine Figur und 4 Bäume herumstehen.
Aber recht oben auf Hide Code geklickt können sie mit der Figur Interagieren mit W, A, S, D, C und F können sie ihn Radschlagen lassen sie umdrehen und in alle Richtungen bewegen.

Viel Spaß beim ausprobieren.