Home Explore Help
Sign In
javascript
/
three.js
mirror of https://github.com/tazdij/three.js.git
2
0
Fork 0
Files Issues 0 Wiki
Browse Source

Merge remote-tracking branch 'WestLangley/dev-sprite' into dev

Mr.doob 11 years ago
parent
b8f30aeaf9 4d7319a00b
commit
5ea8a160fd
3 changed files with 27 additions and 54 deletions
Split View Show Diff Stats
  1. 1 1
      examples/misc_ubiquity_test.html
  2. 4 4
      examples/misc_ubiquity_test2.html
  3. 22 49
      src/renderers/CanvasRenderer.js

+ 1 - 1
examples/misc_ubiquity_test.html
View File 

@@ -1,7 +1,7 @@
 
 <!DOCTYPE html>
 
 <html lang="en">
 
 	<head>
 
-		<title>three.js misc - geometry - polyfield</title>
 
+		<title>three.js misc - ubiquity - test</title>
 
 		<meta charset="utf-8">
 
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 
 		<style>

+ 4 - 4
examples/misc_ubiquity_test2.html
View File 

@@ -1,7 +1,7 @@
 
 <!DOCTYPE html>
 
 <html lang="en">
 
 	<head>
 
-		<title>three.js misc - geometry - polyfield</title>
 
+		<title>three.js misc - ubiquity - test2</title>
 
 		<meta charset="utf-8">
 
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 
 		<style>
 
@@ -104,7 +104,7 @@
 
 					var material = new THREE.SpriteMaterial( { map: texture2, opacity: 0.7 } );
 
 					var sprite = new THREE.Sprite( material );
 
 
-					//sprite.material.rotation = Math.random(); // rotation is not supported by CanvasRenderer when repeating textures
 
+					sprite.material.rotation = 0.5 * Math.PI * ( Math.random() - 0.5 );
 
 
 					sprite.position.x = Math.random() * 1000 - 500;
 
 					sprite.position.y = Math.random() * 1000 - 500;
 
@@ -210,8 +210,8 @@
 
 
 				//
 
 
-				texture2.repeat.x = Math.sin( time ) + 2.0;
 
-				texture2.repeat.y = Math.sin( time ) + 2.0;
 
+				texture2.repeat.x = Math.sin( time ) + 1.25;
 
+				texture2.repeat.y = Math.sin( time ) + 1.25;
 
 
 				texture2.offset.x = Math.sin( time );
 
 				texture2.offset.y = Math.cos( time );

+ 22 - 49
src/renderers/CanvasRenderer.js
View File 

@@ -488,66 +488,39 @@ THREE.CanvasRenderer = function ( parameters ) {
 
 
 				}
 
 
-				//
 
-
 
-				var bitmap = texture.image;
 
-
 
-				if ( texture.repeat.x <= 1 && texture.repeat.y <= 1 ) { // rotation supported
 
-
 
-					var ox = bitmap.width * texture.offset.x;
 
-					var oy = bitmap.height * ( 1 - texture.offset.y - texture.repeat.y );
 
-
 
-					var sx = bitmap.width * texture.repeat.x;
 
-					var sy = bitmap.height * texture.repeat.y;
 
-
 
-					_context.save();
 
-
 
-					_context.translate( v1.x, v1.y );
 
-
 
-					if ( material.rotation !== 0 ) _context.rotate( material.rotation );
 
-
 
-					_context.scale( scaleX, - scaleY );
 
-
 
-					_context.drawImage( bitmap, ox, oy, sx, sy, - 0.5, - 0.5, 1, 1 );
 
-
 
-					_context.restore();
 
-
 
-				} else { // repeat.x or repeat.y > 1 // rotation not supported
 
-
 
-					var ox = bitmap.width * texture.offset.x;
 
-					var oy = bitmap.height * texture.offset.y;
 
+				var pattern = _patterns[ texture.id ];
 
 
-					var sx = bitmap.width * texture.repeat.x;
 
-					var sy = bitmap.height * texture.repeat.y;
 
+				if ( pattern !== undefined ) {
 
 
-					var cx = sx / scaleX;
 
-					var cy = sy / scaleY;
 
+					setFillStyle( pattern );
 
 
-					var pattern = _patterns[ texture.id ];
 
-
 
-					if ( pattern !== undefined ) {
 
-
 
-						setFillStyle( pattern );
 
-
 
-					} else {
 
-
 
-						setFillStyle( 'rgba( 0, 0, 0, 1 )' );
 
+				} else {
 
 
-					}
 
+					setFillStyle( 'rgba( 0, 0, 0, 1 )' );
 
 
-					_context.save();
 
+				}
 
 
-					_context.scale( 1 / cx, 1 / cy );
 
+				//
 
 
-					_context.translate( v1.x * cx - 0.5 * sx - ox, v1.y * cy - 0.5 * sy - oy );
 
+				var bitmap = texture.image;
 
 
-					// if ( material.rotation !== 0 ) _context.rotate( material.rotation ); // rotation not supported when using patterns (origin is offset)
 
+				var ox = bitmap.width * texture.offset.x;
 
+				var oy = bitmap.height * texture.offset.y;
 
 
-					_context.fillRect( ox, oy, sx, sy );
 
+				var sx = bitmap.width * texture.repeat.x;
 
+				var sy = bitmap.height * texture.repeat.y;
 
 
-					_context.restore();
 
+				var cx = scaleX / sx;
 
+				var cy = scaleY / sy;
 
 
-				}
 
+				_context.save();
 
+				_context.translate( v1.x, v1.y );
 
+				if ( material.rotation !== 0 ) _context.rotate( material.rotation );
 
+				_context.translate( - scaleX / 2, - scaleY / 2 );
 
+				_context.scale( cx, cy );
 
+				_context.translate( - ox, - oy );
 
+				_context.fillRect( ox, oy, sx, sy );
 
+				_context.restore();
 
 
 			} else { // no texture