Three js

by Ispringe

HTML

<script src="//cdn.rawgit.com/mrdoob/three.js/master/build/three.min.js"></script>
<script src="//cdn.rawgit.com/mrdoob/three.js/master/src/loaders/ObjectLoader.js"></script>
<script src="//cdn.rawgit.com/mrdoob/three.js/master/examples/js/controls/OrbitControls.js"></script>

CSS

body {
  margin: 0;
}

JavaScript

var camera, scene, renderer;
var geometry, material, cube;
var edges, line;
var controls;
var skybox;
var x, y, z, yinterv;
var object;
init();
animate();

function init() {
//initializations and light
  scene = new THREE.Scene();
  camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 10000);
  renderer = new THREE.WebGLRenderer({
    antialias: true
  });
  renderer.setSize(window.innerWidth, window.innerHeight);
  renderer.setPixelRatio(window.devicePixelRatio);
  renderer.gammaOutput = true;
  document.body.appendChild(renderer.domElement);
  var ambientLight = new THREE.AmbientLight(0xcccccc,0.04);
  var sunLight = new THREE.PointLight(0xcccccc, 1,1000,1);
  scene.add(ambientLight);
  scene.add(sunLight);

  //Controls


  controls = new THREE.OrbitControls(camera, renderer.domElement);
  controls.target.set(0, 0, 0);
  controls.update();


  //Sun and geometries

  var textureLoader = new THREE.TextureLoader();
  var texture1 = textureLoader.load("https://upload.wikimedia.org/wikipedia/commons/9/99/Map_of_the_full_sun.jpg");
  var material1 = new THREE.MeshBasicMaterial({
    color: 0xffffff,
    map: texture1
  });

  geometry = new THREE.SphereGeometry(THREE.Math.randFloat(20, 90), 32, 32);
  material = new THREE.MeshNormalMaterial();
  var spherical = new THREE.Mesh(new THREE.SphereGeometry(150,32,32), material1);
  scene.add(spherical);
  var material2 = new THREE.MeshBasicMaterial(0xffffff);
  cube = new THREE.Mesh(geometry, material2);
  //scene.add(cube);
  var cube2 = new THREE.Mesh(geometry, material2);
  cube2.position.y = 5;
  //cube.add(cube2);
  edges = new THREE.EdgesGeometry(geometry);
  line = new THREE.LineSegments(edges, new THREE.LineBasicMaterial({
    color: 0x000000
  }));
  //scene.add(line);


  //

  /*
			var loader = new THREE.GLTFLoader().setPath('objects/');
			loader.load(
				'scene.gltf',
				function (gltf){
					scene.add(gltf.scene);


				}

			);


				var onProgress = function ( xhr )...