skybox (dynamic cubemap)
HTML
<div id="info">skybox (dynamic cubemap)</div>
<script src="http://cdnjs.cloudflare.com/ajax/libs/three.js/r70/three.min.js"></script>
<script src="https://dl.dropboxusercontent.com/u/3587259/Code/Threejs/OrbitControls.js">
</script>
CSS
#info {
position: absolute;
top: 0px;
width: 100%;
padding: 10px;
text-align: center;
color: #ffff00
}
body {
overflow: hidden;
}
JavaScript
var camera, cubeCamera, scene, renderer;
var cube, sphere, torus;
var controls;
init();
animate();
function init() {
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 1, 10000);
camera.position.set (0,80,80);
scene.add(camera);
renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
renderer.setClearColor(0x880000);
document.body.appendChild(renderer.domElement);
/////////////////////////////////////////////////////////////////////////
/// pure skybox
THREE.ImageUtils.crossOrigin = '';
var pztex = THREE.ImageUtils.loadTexture(
"http://i.imgur.com/yEOMzQg.jpg");
var pytex = THREE.ImageUtils.loadTexture(
"http://i.imgur.com/nVMAfLw.jpg");
var pxtex = THREE.ImageUtils.loadTexture(
"http://i.imgur.com/EnD4hQd.jpg");
var nztex = THREE.ImageUtils.loadTexture(
"http://i.imgur.com/GhEpGuR.jpg");
var nytex = THREE.ImageUtils.loadTexture(
"http://i.imgur.com/k6UxiiZ.jpg");
var nxtex = THREE.ImageUtils.loadTexture(
"http://i.imgur.com/tUboeCr.jpg");
var materialArray = [];
materialArray.push(new THREE.MeshBasicMaterial({
map: pxtex,
side: THREE.BackSide
}));
materialArray.push(new THREE.MeshBasicMaterial({
map: nxtex,
side: THREE.BackSide
}));
materialArray.push(new THREE.MeshBasicMaterial({
map: pytex,
side: THREE.BackSide
}));
materialArray.push(new THREE.MeshBasicMaterial({
map: nytex,
side: THREE.BackSide
}));
materialArray.push(new THREE.MeshBasicMaterial({
map: pztex,
side: THREE.BackSide
}));
materialArray.push(new THREE.MeshBasicMaterial({
map: nztex,
side: THREE.BackSide
}));
var skyboxGeometry = new THREE.BoxGeometry(500, 500, 500);
var skyboxMaterial = new...