Browse Source

Added wireframe_linecap and wireframe_linejoin to main materials.
Fixed SVGRenderer.

Mr.doob 14 years ago
parent
commit
87b37e124a

+ 15 - 6
src/materials/MeshBasicMaterial.js

@@ -25,33 +25,39 @@ THREE.MeshBasicMaterial = function ( parameters ) {
 
 	this.color = new THREE.Color( 0xeeeeee );
 	this.map = null;
-	
+
 	this.env_map = null;
 	this.combine = THREE.Multiply;
 	this.reflectivity = 1;
 	this.refraction_ratio = 0.98;
-	
+
 	this.opacity = 1;
 	this.shading = THREE.SmoothShading;
 	this.blending = THREE.NormalBlending;
+
 	this.wireframe = false;
 	this.wireframe_linewidth = 1;
+	this.wireframe_linecap = 'round';
+	this.wireframe_linejoin = 'round';
 
 	if ( parameters ) {
 
 		if ( parameters.color !== undefined ) this.color.setHex( parameters.color );
 		if ( parameters.map !== undefined ) this.map = parameters.map;
-		
+
 		if ( parameters.env_map !== undefined ) this.env_map = parameters.env_map;
 		if ( parameters.combine !== undefined ) this.combine = parameters.combine;
 		if ( parameters.reflectivity !== undefined ) this.reflectivity  = parameters.reflectivity;
 		if ( parameters.refraction_ratio !== undefined ) this.refraction_ratio  = parameters.refraction_ratio;
-		
+
 		if ( parameters.opacity !== undefined ) this.opacity  = parameters.opacity;
 		if ( parameters.shading !== undefined ) this.shading = parameters.shading;
 		if ( parameters.blending !== undefined ) this.blending = parameters.blending;
+
 		if ( parameters.wireframe !== undefined ) this.wireframe = parameters.wireframe;
 		if ( parameters.wireframe_linewidth !== undefined ) this.wireframe_linewidth = parameters.wireframe_linewidth;
+		if ( parameters.wireframe_linecap !== undefined ) this.wireframe_linecap = parameters.wireframe_linecap;
+		if ( parameters.wireframe_linejoin !== undefined ) this.wireframe_linejoin = parameters.wireframe_linejoin;
 
 	}
 
@@ -61,16 +67,19 @@ THREE.MeshBasicMaterial = function ( parameters ) {
 			'id: ' + this.id + '<br/>' +
 			'color: ' + this.color + '<br/>' +
 			'map: ' + this.map + '<br/>' +
-		
+
 			'env_map: ' + this.env_map + '<br/>' +
 			'combine: ' + this.combine + '<br/>' +
 			'reflectivity: ' + this.reflectivity + '<br/>' +
 			'refraction_ratio: ' + this.refraction_ratio + '<br/>' +
-		
+
 			'opacity: ' + this.opacity + '<br/>' +
 			'blending: ' + this.blending + '<br/>' +
+
 			'wireframe: ' + this.wireframe + '<br/>' +
 			'wireframe_linewidth: ' + this.wireframe_linewidth +'<br/>' +
+			'wireframe_linecap: ' + this.wireframe_linecap +'<br/>' +
+			'wireframe_linejoin: ' + this.wireframe_linejoin +'<br/>' +
 			')';
 
 	};

+ 16 - 7
src/materials/MeshLambertMaterial.js

@@ -25,33 +25,39 @@ THREE.MeshLambertMaterial = function ( parameters ) {
 
 	this.color = new THREE.Color( 0xeeeeee );
 	this.map = null;
-	
+
 	this.env_map = null;
 	this.combine = THREE.Multiply;
 	this.reflectivity = 1;
 	this.refraction_ratio = 0.98;
-	
+
 	this.opacity = 1;
 	this.shading = THREE.SmoothShading;
 	this.blending = THREE.NormalBlending;
+
 	this.wireframe = false;
 	this.wireframe_linewidth = 1;
+	this.wireframe_linecap = 'round';
+	this.wireframe_linejoin = 'round';
 
 	if ( parameters ) {
 
 		if ( parameters.color !== undefined ) this.color.setHex( parameters.color );
 		if ( parameters.map !== undefined ) this.map = parameters.map;
-		
+
 		if ( parameters.env_map !== undefined ) this.env_map = parameters.env_map;
 		if ( parameters.combine !== undefined ) this.combine = parameters.combine;
 		if ( parameters.reflectivity !== undefined ) this.reflectivity  = parameters.reflectivity;
 		if ( parameters.refraction_ratio !== undefined ) this.refraction_ratio  = parameters.refraction_ratio;
-		
+
 		if ( parameters.opacity !== undefined ) this.opacity  = parameters.opacity;
 		if ( parameters.shading !== undefined ) this.shading = parameters.shading;
 		if ( parameters.blending !== undefined ) this.blending = parameters.blending;
+
 		if ( parameters.wireframe !== undefined ) this.wireframe = parameters.wireframe;
 		if ( parameters.wireframe_linewidth !== undefined ) this.wireframe_linewidth = parameters.wireframe_linewidth;
+		if ( parameters.wireframe_linecap !== undefined ) this.wireframe_linecap = parameters.wireframe_linecap;
+		if ( parameters.wireframe_linejoin !== undefined ) this.wireframe_linejoin = parameters.wireframe_linejoin;
 
 	}
 
@@ -61,17 +67,20 @@ THREE.MeshLambertMaterial = function ( parameters ) {
 			'id: ' + this.id + '<br/>' +
 			'color: ' + this.color + '<br/>' +
 			'map: ' + this.map + '<br/>' +
-		
+
 			'env_map: ' + this.env_map + '<br/>' +
 			'combine: ' + this.combine + '<br/>' +
 			'reflectivity: ' + this.reflectivity + '<br/>' +
 			'refraction_ratio: ' + this.refraction_ratio + '<br/>' +
-		
+
 			'opacity: ' + this.opacity + '<br/>' +
 			'shading: ' + this.shading + '<br/>' +
 			'blending: ' + this.blending + '<br/>' +
+
 			'wireframe: ' + this.wireframe + '<br/>' +
-			'wireframe_size: ' + this.wireframe_linewidth + '<br/>' +
+			'wireframe_linewidth: ' + this.wireframe_linewidth +'<br/>' +
+			'wireframe_linecap: ' + this.wireframe_linecap +'<br/>' +
+			'wireframe_linejoin: ' + this.wireframe_linejoin +'<br/>' +
 			' )';
 
 	};

+ 18 - 9
src/materials/MeshPhongMaterial.js

@@ -32,20 +32,23 @@ THREE.MeshPhongMaterial = function ( parameters ) {
 	this.ambient = new THREE.Color( 0x050505 );
 	this.specular = new THREE.Color( 0x111111 );
 	this.shininess = 30;
-	
+
 	this.map = null;
 	this.specular_map = null;
-	
+
 	this.env_map = null;
 	this.combine = THREE.Multiply;
 	this.reflectivity = 1;
 	this.refraction_ratio = 0.98;
-	
+
 	this.opacity = 1;
 	this.shading = THREE.SmoothShading;
 	this.blending = THREE.NormalBlending;
+
 	this.wireframe = false;
 	this.wireframe_linewidth = 1;
+	this.wireframe_linecap = 'round';
+	this.wireframe_linejoin = 'round';
 
 	if ( parameters ) {
 
@@ -53,20 +56,23 @@ THREE.MeshPhongMaterial = function ( parameters ) {
 		if ( parameters.ambient !== undefined ) this.ambient = new THREE.Color( parameters.ambient );
 		if ( parameters.specular !== undefined ) this.specular = new THREE.Color( parameters.specular );
 		if ( parameters.shininess !== undefined ) this.shininess = parameters.shininess;
-		
+
 		if ( parameters.map !== undefined ) this.map = parameters.map;
 		if ( parameters.specular_map !== undefined ) this.specular_map = parameters.specular_map;
-		
+
 		if ( parameters.env_map !== undefined ) this.env_map = parameters.env_map;
 		if ( parameters.combine !== undefined ) this.combine = parameters.combine;
 		if ( parameters.reflectivity !== undefined ) this.reflectivity  = parameters.reflectivity;
 		if ( parameters.refraction_ratio !== undefined ) this.refraction_ratio  = parameters.refraction_ratio;
-		
+
 		if ( parameters.opacity !== undefined ) this.opacity = parameters.opacity;
 		if ( parameters.shading !== undefined ) this.shading = parameters.shading;
 		if ( parameters.blending !== undefined ) this.blending = parameters.blending;
+
 		if ( parameters.wireframe !== undefined ) this.wireframe = parameters.wireframe;
 		if ( parameters.wireframe_linewidth !== undefined ) this.wireframe_linewidth = parameters.wireframe_linewidth;
+		if ( parameters.wireframe_linecap !== undefined ) this.wireframe_linecap = parameters.wireframe_linecap;
+		if ( parameters.wireframe_linejoin !== undefined ) this.wireframe_linejoin = parameters.wireframe_linejoin;
 
 	}
 
@@ -78,19 +84,22 @@ THREE.MeshPhongMaterial = function ( parameters ) {
 			'ambient: ' + this.ambient + '<br/>' +
 			'specular: ' + this.specular + '<br/>' +
 			'shininess: ' + this.shininess + '<br/>' +
-		
+
 			'map: ' + this.map + '<br/>' +
 			'specular_map: ' + this.specular_map + '<br/>' +
-		
+
 			'env_map: ' + this.env_map + '<br/>' +
 			'combine: ' + this.combine + '<br/>' +
 			'reflectivity: ' + this.reflectivity + '<br/>' +
 			'refraction_ratio: ' + this.refraction_ratio + '<br/>' +
-		
+
 			'opacity: ' + this.opacity + '<br/>' +
 			'shading: ' + this.shading + '<br/>' +
+
 			'wireframe: ' + this.wireframe + '<br/>' +
 			'wireframe_linewidth: ' + this.wireframe_linewidth + '<br/>' +
+			'wireframe_linecap: ' + this.wireframe_linecap +'<br/>' +
+			'wireframe_linejoin: ' + this.wireframe_linejoin +'<br/>' +
 			+ ')';
 
 	};

+ 5 - 15
src/renderers/SVGRenderer.js

@@ -67,8 +67,7 @@ THREE.SVGRenderer = function () {
 
 	this.render = function( scene, camera ) {
 
-		var e, el, m, ml, fm, fml, element, material,
-		linecap, linejoin;
+		var e, el, m, ml, fm, fml, element, material;
 
 		if ( this.autoClear ) {
 
@@ -352,15 +351,12 @@ THREE.SVGRenderer = function () {
 
 			_color.__styleString = material.color.__styleString;
 
-		} else {
+			_svgNode.setAttribute( 'style', 'fill: none; stroke: ' + _color.__styleString + '; stroke-width: ' + material.linewidth + '; stroke-opacity: ' + material.opacity + '; stroke-linecap: ' + material.linecap + '; stroke-linejoin: ' + material.linejoin );
 
-			_color.__styleString = 'rgb(0,0,0)';
+			_svg.appendChild( _svgNode );
 
 		}
 
-		_svgNode.setAttribute( 'style', 'fill: none; stroke: ' + _color.__styleString + '; stroke-width: ' + material.linewidth );
-
-		_svg.appendChild( _svgNode );
 	}
 
 	function renderFace3( v1, v2, v3, element, material, scene ) {
@@ -407,7 +403,7 @@ THREE.SVGRenderer = function () {
 
 		if ( material.wireframe ) {
 
-			_svgNode.setAttribute( 'style', 'fill: none; stroke: ' + _color.__styleString + '; stroke-width: ' + material.wireframe_linewidth + '; stroke-opacity: ' + material.opacity + '; stroke-linecap: ' + linecap + '; stroke-linejoin: ' + linejoin );
+			_svgNode.setAttribute( 'style', 'fill: none; stroke: ' + _color.__styleString + '; stroke-width: ' + material.wireframe_linewidth + '; stroke-opacity: ' + material.opacity + '; stroke-linecap: ' + material.wireframe_linecap + '; stroke-linejoin: ' + material.wireframe_linejoin );
 
 		} else {
 
@@ -424,8 +420,6 @@ THREE.SVGRenderer = function () {
 		_svgNode = getPathNode( _pathCount ++ );
 		_svgNode.setAttribute( 'd', 'M ' + v1.positionScreen.x + ' ' + v1.positionScreen.y + ' L ' + v2.positionScreen.x + ' ' + v2.positionScreen.y + ' L ' + v3.positionScreen.x + ',' + v3.positionScreen.y + ' L ' + v4.positionScreen.x + ',' + v4.positionScreen.y + 'z' );
 
-		linecap = linejoin = 'round';
-
 		if ( material instanceof THREE.MeshBasicMaterial ) {
 
 			_color.__styleString = material.color.__styleString;
@@ -461,15 +455,11 @@ THREE.SVGRenderer = function () {
 
 			_color.setRGB( normalToComponent( element.normalWorld.x ), normalToComponent( element.normalWorld.y ), normalToComponent( element.normalWorld.z ) );
 
-		} else if ( material instanceof THREE.LineBasicMaterial ) {
-			_color.__styleString = material.color.__styleString;
-			linecap = material.linecap;
-			linejoin = material.linejoin;
 		}
 
 		if ( material.wireframe ) {
 
-			_svgNode.setAttribute( 'style', 'fill: none; stroke: ' + _color.__styleString + '; stroke-width: ' + material.wireframe_linewidth + '; stroke-opacity: ' + material.opacity + '; stroke-linecap: ' + linecap + '; stroke-linejoin: ' + linejoin );
+			_svgNode.setAttribute( 'style', 'fill: none; stroke: ' + _color.__styleString + '; stroke-width: ' + material.wireframe_linewidth + '; stroke-opacity: ' + material.opacity + '; stroke-linecap: ' + material.wireframe_linecap + '; stroke-linejoin: ' + material.wireframe_linejoin );
 
 		} else {