jonathan
/
Portfolio
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Compare commits

base: jonathan:2d5c52b3ea4c915511650002ca0601af3468444b
Branches Tags
jonathan:master
...
compare: jonathan:a030d7816d508877d0da82b997932aaf21e65484
Branches Tags
jonathan:master

2 Commits
2d5c52b3ea ... a030d7816d

Author SHA1 Message Date
root a030d7816d Remove vim swp file
2 years ago
root baae1c727b Orbitalsteuerung korrigieren
2 years ago
3 changed files with 8 additions and 45 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats
  1. 10
      index.html
  2. 27
      main.js
  3. 16
      style.css

10
index.html
Unescape View File

@ -3,19 +3,15 @@
<head> <head>
<base href="/website/"> <base href="/website/">
<meta charset="UTF-8"> <meta charset="UTF-8">
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
<title>Space</title> <title>Space</title>
</head> </head>
<body> <body>
<canvas id="bg"></canvas>
<main> <main>
<header>
<h1>„Jedes Lebewesen ist ein Rädchen im Getriebe des Universums. Obwohl scheinbar nur seine unmittelbare Umgebung betroffen ist, erstreckt sich der Einflussbereich jedes Lebewesens über eine unendliche Distanz.“ - Nikola Tesla
</h1>
</header>
<section> <section>
<p>Moin!</p> <button type="button" id="steuerungOrbitalButton">Steuerung aktivieren!</button>
<a href="https://www.solarsystemscope.com/textures/">Texturen von https://www.solarsystemscope.com/textures/</a> <a href="https://www.solarsystemscope.com/textures/">Texturen von https://www.solarsystemscope.com/textures/</a>
<canvas id="bg"></canvas>
</section> </section>
</main> </main>

27
main.js
Unescape View File

@ -1,8 +1,6 @@
/** /**
* Texturen von https://www.solarsystemscope.com/textures/ * Texturen von https://www.solarsystemscope.com/textures/
*/ */
import * as THREE from '/website/node_modules/three/build/three.module.js'; import * as THREE from '/website/node_modules/three/build/three.module.js';
import * as EARTH from '/website/earth/earth.js'; import * as EARTH from '/website/earth/earth.js';
import * as VENUS from '/website/venus/venus.js'; import * as VENUS from '/website/venus/venus.js';
@ -14,12 +12,10 @@ import * as MOON from '/website/moon/moon.js';
import * as URANUS from '/website/uranus/uranus.js'; import * as URANUS from '/website/uranus/uranus.js';
import { OrbitControls } from '/website/node_modules/three/examples/jsm/controls/OrbitControls.js'; import { OrbitControls } from '/website/node_modules/three/examples/jsm/controls/OrbitControls.js';
// Die Szenerie erstellen // Die Szenerie erstellen
const scene = new THREE.Scene(); const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000); const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
const renderer = new THREE.WebGLRenderer({ const renderer = new THREE.WebGLRenderer({
canvas: document.querySelector('#bg'), canvas: document.querySelector('#bg'),
}); });
@ -27,8 +23,6 @@ const renderer = new THREE.WebGLRenderer({
renderer.setPixelRatio(window.devicePixelRatio); renderer.setPixelRatio(window.devicePixelRatio);
renderer.setSize(window.innerWidth, window.innerHeight); renderer.setSize(window.innerWidth, window.innerHeight);
var cameraX = 200; var cameraX = 200;
var cameraY = 100; var cameraY = 100;
var cameraZ = 100; var cameraZ = 100;
@ -43,7 +37,6 @@ const material = new THREE.MeshBasicMaterial({ map: sunTexture });
const sun = new THREE.Mesh( sunSphere, material ); const sun = new THREE.Mesh( sunSphere, material );
// Mittelpunkte fuer die Planeten festlegen // Mittelpunkte fuer die Planeten festlegen
// Offentsichtlicherweise um die Sonne
const pivotEARTH = new THREE.Object3D(); const pivotEARTH = new THREE.Object3D();
const pivotVENUS = new THREE.Object3D(); const pivotVENUS = new THREE.Object3D();
const pivotMERKUR = new THREE.Object3D(); const pivotMERKUR = new THREE.Object3D();
@ -51,8 +44,9 @@ const pivotMARS = new THREE.Object3D();
const pivotJUPITER = new THREE.Object3D(); const pivotJUPITER = new THREE.Object3D();
const pivotSATURN = new THREE.Object3D(); const pivotSATURN = new THREE.Object3D();
const pivotURANUS = new THREE.Object3D(); const pivotURANUS = new THREE.Object3D();
const pivotCamera = new THREE.Object3D(); //const pivotCamera = new THREE.Object3D();
//Planeten der Sonne hinzufügen
scene.add(pivotEARTH); scene.add(pivotEARTH);
scene.add(pivotVENUS); scene.add(pivotVENUS);
scene.add(pivotMERKUR); scene.add(pivotMERKUR);
@ -60,7 +54,7 @@ scene.add(pivotMARS);
scene.add(pivotJUPITER); scene.add(pivotJUPITER);
scene.add(pivotSATURN); scene.add(pivotSATURN);
scene.add(pivotURANUS); scene.add(pivotURANUS);
scene.add(pivotCamera); //scene.add(pivotCamera);
pivotEARTH.add(EARTH.earth); pivotEARTH.add(EARTH.earth);
pivotVENUS.add(VENUS.venus); pivotVENUS.add(VENUS.venus);
@ -69,18 +63,15 @@ pivotMARS.add(MARS.mars);
pivotJUPITER.add(JUPITER.jupiter); pivotJUPITER.add(JUPITER.jupiter);
pivotSATURN.add(SATURN.saturn); pivotSATURN.add(SATURN.saturn);
pivotURANUS.add(URANUS.uranus); pivotURANUS.add(URANUS.uranus);
pivotURANUS.add(camera);
// Den Mond hinzufügen // Den Mond hinzufügen
EARTH.pivot.add(MOON.moon); EARTH.pivot.add(MOON.moon);
scene.add( sun ); scene.add(sun);
// licht // Licht
const pointLight = new THREE.PointLight(0xffffff); const pointLight = new THREE.PointLight(0xffffff);
//pointLight.position.set(5,5,5);
const ambientLight = new THREE.PointLight(0xffffff); const ambientLight = new THREE.PointLight(0xffffff);
//Steuerung & Kamera //Steuerung & Kamera
@ -113,7 +104,6 @@ scene.add(pointLight);
//scene.add(gridHelper); //scene.add(gridHelper);
scene.add(ambientLight); scene.add(ambientLight);
renderer.render( scene, camera ); renderer.render( scene, camera );
/** /**
@ -140,16 +130,9 @@ function animate() {
pivotSATURN.rotation.y -= 0.005; pivotSATURN.rotation.y -= 0.005;
pivotURANUS.rotation.y += 0.005; pivotURANUS.rotation.y += 0.005;
cameraX += 0.000001;
cameraZ += 0.000001;
camera.position.setZ(cameraZ);
camera.position.setX(cameraX);
camera.position.setY(cameraY);
controls.update(); controls.update();
renderer.render( scene, camera ); renderer.render( scene, camera );
} }
animate(); animate();

16
style.css
Unescape View File

@ -1,17 +1 @@
canvas {
position:fixed !important;
top: 0 !important;
left: 0 !important;
}
main {
width: 100% !important;
height: 100% !important;
position: absolute !important;
z-index: 99 !important;
color: white !important;
}
a {
color:white !important;
}

Write Preview
Loading…
Cancel
Save