Startsida Utforska Hjälp
Logga in
javascript
/
three.js
spegling av https://github.com/tazdij/three.js.git
2
0
Fork 0
Filer Ärenden 0 Wiki
Bläddra i källkod

More clean up to ubiquity test example. Also added ubiquity test2 for uvScale/uvOffset.

Mr.doob 11 år sedan
förälder
0c00b1843f
incheckning
6f119469a0
2 ändrade filer med 157 tillägg och 34 borttagningar
Unifierad Vy Visa Diff Statistik
  1. 20 34
      examples/misc_ubiquity_test.html
  2. 137 0
      examples/misc_ubiquity_test2.html

+ 20 - 34
examples/misc_ubiquity_test.html
Visa fil 

@@ -24,8 +24,6 @@
 
 
 
 		<script>
 
 		<script>
 
 
 
-			var SCREEN_WIDTH = window.innerWidth / 2;
 
-			var SCREEN_HEIGHT = window.innerHeight / 2;
 
 			var AMOUNT = 100;
 
 			var AMOUNT = 100;
 
 
 
 			var stats;
 
 			var stats;
 
@@ -35,17 +33,15 @@
 
 
 
 			var mesh, group;
 
 			var mesh, group;
 
 
 
-			var mouseX = 0, mouseY = 0;
 
-
 
-			var windowHalfX = window.innerWidth / 2;
 
-			var windowHalfY = window.innerHeight / 2;
 
-
 
 			init();
 
 			init();
 
 			animate();
 
 			animate();
 
 
 
 			function init() {
 
 			function init() {
 
 
 
-				camera = new THREE.PerspectiveCamera( 75, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 100000 );
 
+				var width = window.innerWidth / 2;
 
+				var height = window.innerHeight / 2;
 
+
 
+				camera = new THREE.PerspectiveCamera( 75, width / height, 1, 10000 );
 
 				camera.position.z = 500;
 
 				camera.position.z = 500;
 
 
 
 				scene = new THREE.Scene();
 
 				scene = new THREE.Scene();
 
@@ -184,23 +180,23 @@
 
 
 
 				canvasRenderer = new THREE.CanvasRenderer();
 
 				canvasRenderer = new THREE.CanvasRenderer();
 
 				canvasRenderer.setClearColor( 0xf0f0f0 );
 
 				canvasRenderer.setClearColor( 0xf0f0f0 );
 
-				canvasRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 
+				canvasRenderer.setSize( width, height );
 
 				document.body.appendChild( canvasRenderer.domElement );
 
 				document.body.appendChild( canvasRenderer.domElement );
 
 
 
 				svgRenderer = new THREE.SVGRenderer();
 
 				svgRenderer = new THREE.SVGRenderer();
 
 				svgRenderer.setClearColor( 0xf0f0f0 );
 
 				svgRenderer.setClearColor( 0xf0f0f0 );
 
-				svgRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 
+				svgRenderer.setSize( width, height );
 
 				svgRenderer.setQuality( 'low' );
 
 				svgRenderer.setQuality( 'low' );
 
 				document.body.appendChild( svgRenderer.domElement );
 
 				document.body.appendChild( svgRenderer.domElement );
 
 
 
 				softwareRenderer = new THREE.SoftwareRenderer();
 
 				softwareRenderer = new THREE.SoftwareRenderer();
 
 				softwareRenderer.setClearColor( 0xf0f0f0 );
 
 				softwareRenderer.setClearColor( 0xf0f0f0 );
 
-				softwareRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 
+				softwareRenderer.setSize( width, height );
 
 				document.body.appendChild( softwareRenderer.domElement );
 
 				document.body.appendChild( softwareRenderer.domElement );
 
 
 
 				webglRenderer = new THREE.WebGLRenderer( { antialias: true } );
 
 				webglRenderer = new THREE.WebGLRenderer( { antialias: true } );
 
 				webglRenderer.setClearColor( 0xf0f0f0 );
 
 				webglRenderer.setClearColor( 0xf0f0f0 );
 
-				webglRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 
+				webglRenderer.setSize( width, height );
 
 				document.body.appendChild( webglRenderer.domElement );
 
 				document.body.appendChild( webglRenderer.domElement );
 
 
 
 				stats = new Stats();
 
 				stats = new Stats();
 
@@ -208,8 +204,6 @@
 
 				stats.domElement.style.top = '0px';
 
 				stats.domElement.style.top = '0px';
 
 				document.body.appendChild( stats.domElement );
 
 				document.body.appendChild( stats.domElement );
 
 
 
-				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 
-
 
 				//
 
 				//
 
 
 
 				window.addEventListener( 'resize', onWindowResize, false );
 
 				window.addEventListener( 'resize', onWindowResize, false );
 
@@ -218,26 +212,16 @@
 
 
 
 			function onWindowResize() {
 
 			function onWindowResize() {
 
 
 
-				windowHalfX = window.innerWidth / 2;
 
-				windowHalfY = window.innerHeight / 2;
 
-
 
-				SCREEN_WIDTH = window.innerWidth / 2;
 
-				SCREEN_HEIGHT = window.innerHeight / 2;
 
+				var width = window.innerWidth / 2;
 
+				var height = window.innerHeight / 2;
 
 
 
-				camera.aspect = SCREEN_WIDTH / window.SCREEN_HEIGHT;
 
+				camera.aspect = width / height;
 
 				camera.updateProjectionMatrix();
 
 				camera.updateProjectionMatrix();
 
 
 
-				canvasRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 
-				svgRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 
-				softwareRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 
-				webglRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 
-
 
-			}
 
-
 
-			function onDocumentMouseMove( event ) {
 
-
 
-				mouseX = ( event.clientX - windowHalfX );
 
-				mouseY = ( event.clientY - windowHalfY );
 
+				canvasRenderer.setSize( width, height );
 
+				svgRenderer.setSize( width, height );
 
+				softwareRenderer.setSize( width, height );
 
+				webglRenderer.setSize( width, height );
 
 
 
 			}
 
 			}
 
 
 
@@ -254,11 +238,13 @@
 
 
 
 			function render() {
 
 			function render() {
 
 
 
-				camera.position.x += ( mouseX - camera.position.x ) * .05;
 
-				camera.position.y += ( - mouseY - camera.position.y ) * .05;
 
+				var time = Date.now() * 0.0002;
 
+
 
+				camera.position.x = Math.sin( time ) * 500;
 
+				camera.position.z = Math.cos( time ) * 500;
 
 				camera.lookAt( scene.position );
 
 				camera.lookAt( scene.position );
 
 
 
-				group.rotation.y += 0.01;
 
+				group.rotation.x += 0.01;
 
 
 
 				scene.updateMatrixWorld();
 
 				scene.updateMatrixWorld();

+ 137 - 0
examples/misc_ubiquity_test2.html
Visa fil 

@@ -0,0 +1,137 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+	<head>
 
+		<title>three.js misc - geometry - polyfield</title>
 
+		<meta charset="utf-8">
 
+		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 
+		<style>
 
+			body {
 
+				background-color: #ffffff;
 
+				margin: 0px;
 
+				overflow: hidden;
 
+			}
 
+		</style>
 
+	</head>
 
+	<body>
 
+
 
+		<script src="../build/three.min.js"></script>
 
+
 
+		<script src="js/renderers/SVGRenderer.js"></script>
 
+		<script src="js/renderers/SoftwareRenderer.js"></script>
 
+		<script src="js/libs/stats.min.js"></script>
 
+
 
+		<script src="obj/Qrcode.js"></script>
 
+
 
+		<script>
 
+
 
+			var stats;
 
+
 
+			var camera, scene;
 
+			var canvasRenderer, svgRenderer, softwareRenderer, webglRenderer;
 
+
 
+			var mesh;
 
+
 
+			init();
 
+			animate();
 
+
 
+			function init() {
 
+
 
+				var width = window.innerWidth / 2;
 
+				var height = window.innerHeight / 2;
 
+
 
+				camera = new THREE.PerspectiveCamera( 70, width / height, 1, 1000 );
 
+				camera.position.z = 400;
 
+
 
+				scene = new THREE.Scene();
 
+
 
+				var geometry = new THREE.CubeGeometry( 200, 200, 200 );
 
+
 
+				var texture = THREE.ImageUtils.loadTexture( 'textures/ash_uvgrid01.jpg' );
 
+
 
+				var material = new THREE.MeshBasicMaterial( { map: texture } );
 
+
 
+				mesh = new THREE.Mesh( geometry, material );
 
+				scene.add( mesh );
 
+
 
+				canvasRenderer = new THREE.CanvasRenderer();
 
+				canvasRenderer.setClearColor( 0xf0f0f0 );
 
+				canvasRenderer.setSize( width, height );
 
+				document.body.appendChild( canvasRenderer.domElement );
 
+
 
+				svgRenderer = new THREE.SVGRenderer();
 
+				svgRenderer.setClearColor( 0xf0f0f0 );
 
+				svgRenderer.setSize( width, height );
 
+				svgRenderer.setQuality( 'low' );
 
+				document.body.appendChild( svgRenderer.domElement );
 
+
 
+				softwareRenderer = new THREE.SoftwareRenderer();
 
+				softwareRenderer.setClearColor( 0xf0f0f0 );
 
+				softwareRenderer.setSize( width, height );
 
+				document.body.appendChild( softwareRenderer.domElement );
 
+
 
+				webglRenderer = new THREE.WebGLRenderer( { antialias: true } );
 
+				webglRenderer.setClearColor( 0xf0f0f0 );
 
+				webglRenderer.setSize( width, height );
 
+				document.body.appendChild( webglRenderer.domElement );
 
+
 
+				stats = new Stats();
 
+				stats.domElement.style.position = 'absolute';
 
+				stats.domElement.style.top = '0px';
 
+				document.body.appendChild( stats.domElement );
 
+
 
+				//
 
+
 
+				window.addEventListener( 'resize', onWindowResize, false );
 
+
 
+			}
 
+
 
+			function onWindowResize() {
 
+
 
+				var width = window.innerWidth / 2;
 
+				var height = window.innerHeight / 2;
 
+
 
+				camera.aspect = width / height;
 
+				camera.updateProjectionMatrix();
 
+
 
+				canvasRenderer.setSize( width, height );
 
+				svgRenderer.setSize( width, height );
 
+				softwareRenderer.setSize( width, height );
 
+				webglRenderer.setSize( width, height );
 
+
 
+			}
 
+
 
+			//
 
+
 
+			function animate() {
 
+
 
+				requestAnimationFrame( animate );
 
+
 
+				render();
 
+				stats.update();
 
+
 
+			}
 
+
 
+			function render() {
 
+
 
+				var time = Date.now() * 0.0002;
 
+
 
+				camera.position.x = Math.sin( time ) * 500;
 
+				camera.position.z = Math.cos( time ) * 500;
 
+				camera.lookAt( scene.position );
 
+
 
+				mesh.rotation.x += 0.01;
 
+				mesh.rotation.y += 0.02;
 
+
 
+				scene.updateMatrixWorld();
 
+
 
+				canvasRenderer.render( scene, camera );
 
+				svgRenderer.render( scene, camera );
 
+				softwareRenderer.render( scene, camera );
 
+				webglRenderer.render( scene, camera );
 
+
 
+			}
 
+
 
+		</script>
 
+
 
+	</body>
 
+</html>