JavaScript
语言:
JaveScriptBabelCoffeeScript
确定
function getMat(color) {
// our material is a phong material, with no shininess (highlight) and a black specular
return new THREE.MeshPhongMaterial({
color: color,
shininess: 0,
specular: 0x000000,
shading: THREE.FlatShading // THREE.SmoothShading
});
}
// colors
var Colors = {
green: 0x8fc999,
blue: 0x5fc4d0,
orange: 0xee5624,
yellow: 0xfaff70,
}
var colorsLength = Object.keys(Colors).length;
function getRandomColor() {
var colIndx = Math.floor(Math.random() * colorsLength);
var colorStr = Object.keys(Colors)[colIndx];
return Colors[colorStr];
}
// parameters to customize the planet
var parameters = {
minRadius: 30,
maxRadius: 50,
minSpeed: .015,
maxSpeed: .025,
particles: 300,
minSize: .1,
maxSize: 2,
}
// For a THREEJS project we need at least
// a scene
// a renderer
// a camera
// a light (1 or many)
// a mesh (an object to display)
var scene, renderer, camera, saturn, light;
var WIDTH = window.innerWidth,
HEIGHT = window.innerHeight;
var controls;
// initialise the world
function initWorld() {
//
// THE SCENE
//
scene = new THREE.Scene();
//
// THE CAMERA
//
// Perspective or Orthographic
// Field of view : I use 75, play with it
// Aspect ratio : width / height of the screen
// near and far plane : I usually set them at .1 and 2000
/*
camera = new THREE.PerspectiveCamera(
fieldOfView,
aspectRatio,
nearPlane,
farPlane
);
*/
camera = new THREE.PerspectiveCamera(75, WIDTH / HEIGHT, .1, 2000);
camera.position.z = 100;
//
// THE RENDERER
//
renderer = new THREE.WebGLRenderer({
alpha: true,
antialias: true
});
renderer.setSize(WIDTH, HEIGHT);
renderer.shadowMapEnabled = true;
// Make the renderer use the #world div to render le scene
container