<script>

var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera ( 40,( window.innerWidth)/(window.innerHeight), 0.1, 1000 );
var renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );

var light = new THREE.PointLight(0xffffff);
light.position.set(10,0,30);
scene.add(light);

var light2 = new THREE.PointLight(0xffffff,0.1);
light2.position.set(0,20000,0);
scene.add(light2);

var light3 = new THREE.PointLight(0xffffff,0.1);
light3.position.set(0,-20000,0);
scene.add(light3);

var backgroundTexture = new THREE.TextureLoader().load( "/browserMap1.png" );
var geometry = new THREE.SphereGeometry(4, 64, 64, 0, Math.PI * 2, 0, Math.PI * 2);
var material = new THREE.MeshPhongMaterial({ map: backgroundTexture });
var ball = new THREE.Mesh(geometry, material);
scene.add(ball);

camera.position.z = 15;

var t = 0;

var render = function () {
requestAnimationFrame( render );
ball.rotation.y -= 0.005;
renderer.render(scene, camera);
};
render();

</script>

Code for three.js animated Sphere with jpg material
Back