|
@@ -1,7 +1,7 @@
|
|
|
<!DOCTYPE html>
|
|
|
<html lang="en">
|
|
|
<head>
|
|
|
- <title>three.js webgl - interactive lines</title>
|
|
|
+ <title>three.js canvas - interactive lines</title>
|
|
|
<meta charset="utf-8">
|
|
|
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
|
|
|
<style>
|
|
@@ -42,23 +42,15 @@
|
|
|
info.style.top = '10px';
|
|
|
info.style.width = '100%';
|
|
|
info.style.textAlign = 'center';
|
|
|
- info.innerHTML = '<a href="http://threejs.org" target="_blank">three.js</a> webgl - interactive lines';
|
|
|
+ info.innerHTML = '<a href="http://threejs.org" target="_blank">three.js</a> canvas - interactive lines';
|
|
|
container.appendChild( info );
|
|
|
|
|
|
camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 1, 10000 );
|
|
|
|
|
|
scene = new THREE.Scene();
|
|
|
|
|
|
- var light = new THREE.DirectionalLight( 0xffffff, 2 );
|
|
|
- light.position.set( 1, 1, 1 ).normalize();
|
|
|
- scene.add( light );
|
|
|
-
|
|
|
- var light = new THREE.DirectionalLight( 0xffffff );
|
|
|
- light.position.set( -1, -1, -1 ).normalize();
|
|
|
- scene.add( light );
|
|
|
-
|
|
|
var sphereGeometry = new THREE.SphereGeometry(3);
|
|
|
- sphereInter = new THREE.Mesh( sphereGeometry, new THREE.MeshLambertMaterial( { color: 0xff0000 } ) );
|
|
|
+ sphereInter = new THREE.Mesh( sphereGeometry, new THREE.MeshBasicMaterial( { color: 0xff0000 } ) );
|
|
|
sphereInter.visible = false;
|
|
|
scene.add( sphereInter );
|
|
|
|
|
@@ -80,7 +72,7 @@
|
|
|
|
|
|
}
|
|
|
|
|
|
- parentTransform = new THREE.Mesh();
|
|
|
+ parentTransform = new THREE.Object3D();
|
|
|
parentTransform.position.x = Math.random() * 40 - 20;
|
|
|
parentTransform.position.y = Math.random() * 40 - 20;
|
|
|
parentTransform.position.z = Math.random() * 40 - 20;
|
|
@@ -120,7 +112,7 @@
|
|
|
raycaster = new THREE.Raycaster();
|
|
|
raycaster.linePrecision = 3;
|
|
|
|
|
|
- renderer = new THREE.WebGLRenderer();
|
|
|
+ renderer = new THREE.CanvasRenderer();
|
|
|
renderer.sortObjects = false;
|
|
|
renderer.setSize( window.innerWidth, window.innerHeight );
|
|
|
|