skybox (pure)
with orbitControls, XZgrid, info
HTML
<div id="info">skybox (pure) demo</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, scene, renderer, light, controls;
init();
animate();
function init() {
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 1, 10000);
camera.position.z = 500;
scene.add(camera);
renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
renderer.setClearColor(0x888888);
controls = new THREE.OrbitControls(camera, renderer.domElement);
document.body.appendChild(renderer.domElement);
light = new THREE.PointLight(0xffffff);
light.position.set(100, 300, 200);
scene.add(light);
THREE.ImageUtils.crossOrigin = '';
var pztex = THREE.ImageUtils.loadTexture(
"http://i.imgur.com/iXrFMBR.jpg");
var pytex = THREE.ImageUtils.loadTexture(
"http://i.imgur.com/DSapCxm.jpg");
var pxtex = THREE.ImageUtils.loadTexture(
"http://i.imgur.com/DSapCxm.jpg");
var nztex = THREE.ImageUtils.loadTexture(
"http://i.imgur.com/mM83rb6.jpg");
var nytex = THREE.ImageUtils.loadTexture(
"http://i.imgur.com/mM83rb6.jpg");
var nxtex = THREE.ImageUtils.loadTexture(
"http://i.imgur.com/mM83rb6.jpg");
var materialArray = [];
materialArray.push(new THREE.MeshBasicMaterial({
map: pxtex,
side: THREE.DoubleSide
}));
materialArray.push(new THREE.MeshBasicMaterial({
map: nxtex,
side: THREE.DoubleSide
}));
materialArray.push(new THREE.MeshBasicMaterial({
map: pytex,
side: THREE.DoubleSide
}));
materialArray.push(new THREE.MeshBasicMaterial({
map: nytex,
side: THREE.DoubleSide
}));
materialArray.push(new THREE.MeshBasicMaterial({
map: pztex,
side: THREE.DoubleSide
}));
materialArray.push(new THREE.MeshBasicMaterial({
map: nztex,
side: THREE.DoubleSide
}));
var skyboxGeometry = new THREE.BoxGeometry(5000, 5000, 5000);
var...