Skip to content

T
three.js

Ablesons / three.js
与 Fork 源项目一致

从无法访问的项目Fork

通知 2
Star 0
Fork 0
T
three.js

体验新版 GitCode，发现更多精彩内容 >>

提交 d75e7ae4 编写于 作者: M Mr.doob
浏览文件
操作

Added material.vertexColors = THREE.FaceColor support to CanvasRenderer and SVGRenderer.

上级 72b8b8d7
展开全部 隐藏空白更改
内联 并排
Showing with 1233 addition and 1111 deletion
build/three.min.js
浏览文件 @ d75e7ae4
因为 它太大了无法显示 source diff 。你可以改为 查看blob。
examples/canvas_geometry_cube.html
浏览文件 @ d75e7ae4
......@@ -60,22 +60,28 @@
// Cube
var materials = [];
var geometry = new THREE.CubeGeometry( 200, 200, 200 );
for ( var i = 0; i < 6; i ++ ) {
for ( var i = 0; i < geometry.faces.length; i ++ ) {
materials.push( new THREE.MeshBasicMaterial( { color: Math.random() * 0xffffff } ) );
geometry.faces[ i ].color.setHex( Math.random() * 0xffffff );
}
cube = new THREE.Mesh( new THREE.CubeGeometry( 200, 200, 200, 1, 1, 1, materials ), new THREE.MeshFaceMaterial() );
var material = new THREE.MeshBasicMaterial( { vertexColors: THREE.FaceColors } );
cube = new THREE.Mesh( geometry, material );
cube.position.y = 150;
scene.add( cube );
// Plane
plane = new THREE.Mesh( new THREE.PlaneGeometry( 200, 200 ), new THREE.MeshBasicMaterial( { color: 0xe0e0e0 } ) );
plane.geometry.applyMatrix( new THREE.Matrix4().makeRotationX( - Math.PI / 2 ) );
var geometry = new THREE.PlaneGeometry( 200, 200 );
geometry.applyMatrix( new THREE.Matrix4().makeRotationX( - Math.PI / 2 ) );
var material = new THREE.MeshBasicMaterial( { color: 0xe0e0e0 } );
plane = new THREE.Mesh( geometry, material );
scene.add( plane );
renderer = new THREE.CanvasRenderer();
......
examples/canvas_interactive_voxelpainter.html
浏览文件 @ d75e7ae4
......@@ -24,10 +24,10 @@
var container, stats;
var camera, scene, renderer;
var projector, plane;
var mouse2D, mouse3D, ray,
isShiftDown = false,
theta = 45, isCtrlDown = false,
var mouse2D, mouse3D, ray, theta = 45,
isShiftDown = false, isCtrlDown = false,
target = new THREE.Vector3( 0, 200, 0 );
var ROLLOVERED;
init();
animate();
......@@ -140,15 +140,26 @@
mouse2D.x = ( event.clientX / window.innerWidth ) * 2 - 1;
mouse2D.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
mouse3D = projector.unprojectVector( mouse2D.clone(), camera );
ray.direction = mouse3D.subSelf( camera.position ).normalize();
var intersects = ray.intersectObjects( scene.children );
if ( intersects.length > 0 ) {
if ( ROLLOVERED ) ROLLOVERED.color.setHex( 0x00ff80 );
ROLLOVERED = intersects[ 0 ].face;
ROLLOVERED.color.setHex( 0xff8000 )
}
}
function onDocumentMouseDown( event ) {
event.preventDefault();
mouse3D = projector.unprojectVector( mouse2D.clone(), camera );
ray.direction = mouse3D.subSelf( camera.position ).normalize();
var intersects = ray.intersectObjects( scene.children );
if ( intersects.length > 0 ) {
......@@ -165,7 +176,17 @@
var position = new THREE.Vector3().add( intersects[ 0 ].point, intersects[ 0 ].object.matrixRotationWorld.multiplyVector3( intersects[ 0 ].face.normal.clone() ) );
var voxel = new THREE.Mesh( new THREE.CubeGeometry( 50, 50, 50 ), new THREE.MeshLambertMaterial( { color: 0x00ff80, opacity: 1 } ) );
var geometry = new THREE.CubeGeometry( 50, 50, 50 );
for ( var i = 0; i < geometry.faces.length; i ++ ) {
geometry.faces[ i ].color.setHex( 0x00ff80 );
}
var material = new THREE.MeshLambertMaterial( { vertexColors: THREE.FaceColors } );
var voxel = new THREE.Mesh( geometry, material );
voxel.position.x = Math.floor( position.x / 50 ) * 50 + 25;
voxel.position.y = Math.floor( position.y / 50 ) * 50 + 25;
voxel.position.z = Math.floor( position.z / 50 ) * 50 + 25;
......
examples/js/renderers/SVGRenderer.js
浏览文件 @ d75e7ae4
......@@ -19,6 +19,8 @@ THREE.SVGRenderer = function () {
_enableLighting = false,
_color = new THREE.Color(),
_diffuseColor = new THREE.Color(),
_emissiveColor = new THREE.Color(),
_ambientLight = new THREE.Color(),
_directionalLights = new THREE.Color(),
_pointLights = new THREE.Color(),
......@@ -346,12 +348,28 @@ THREE.SVGRenderer = function () {
_color.copy( material.color );
if ( material.vertexColors === THREE.FaceColors ) {
_color.r *= element.color.r;
_color.g *= element.color.g;
_color.b *= element.color.b;
}
} else if ( material instanceof THREE.MeshLambertMaterial ) {
if ( _enableLighting ) {
_diffuseColor.copy( material.color );
_emissiveColor.copy( material.emissive );
var diffuse = material.color;
var emissive = material.emissive;
if ( material.vertexColors === THREE.FaceColors ) {
_diffuseColor.r *= element.color.r;
_diffuseColor.g *= element.color.g;
_diffuseColor.b *= element.color.b;
}
if ( _enableLighting ) {
_color.r = _ambientLight.r;
_color.g = _ambientLight.g;
......@@ -359,13 +377,13 @@ THREE.SVGRenderer = function () {
calculateLight( _lights, element.centroidWorld, element.normalWorld, _color );
_color.r = diffuse.r * _color.r + emissive.r;
_color.g = diffuse.g * _color.g + emissive.g;
_color.b = diffuse.b * _color.b + emissive.b;
_color.r = _color.r * _diffuseColor.r + _emissiveColor.r;
_color.g = _color.g * _diffuseColor.g + _emissiveColor.g;
_color.b = _color.b * _diffuseColor.b + _emissiveColor.b;
} else {
_color.copy( material.color );
_color.copy( _diffuseColor );
}
......@@ -406,12 +424,28 @@ THREE.SVGRenderer = function () {
_color.copy( material.color );
if ( material.vertexColors === THREE.FaceColors ) {
_color.r *= element.color.r;
_color.g *= element.color.g;
_color.b *= element.color.b;
}
} else if ( material instanceof THREE.MeshLambertMaterial ) {
if ( _enableLighting ) {
_diffuseColor.copy( material.color );
_emissiveColor.copy( material.emissive );
var diffuse = material.color;
var emissive = material.emissive;
if ( material.vertexColors === THREE.FaceColors ) {
_diffuseColor.r *= element.color.r;
_diffuseColor.g *= element.color.g;
_diffuseColor.b *= element.color.b;
}
if ( _enableLighting ) {
_color.r = _ambientLight.r;
_color.g = _ambientLight.g;
......@@ -419,13 +453,13 @@ THREE.SVGRenderer = function () {
calculateLight( _lights, element.centroidWorld, element.normalWorld, _color );
_color.r = diffuse.r * _color.r + emissive.r;
_color.g = diffuse.g * _color.g + emissive.g;
_color.b = diffuse.b * _color.b + emissive.b;
_color.r = _color.r * _diffuseColor.r + _emissiveColor.r;
_color.g = _color.g * _diffuseColor.g + _emissiveColor.g;
_color.b = _color.b * _diffuseColor.b + _emissiveColor.b;
} else {
_color.copy( material.color );
_color.copy( _diffuseColor );
}
......
examples/misc_ubiquity_test.html
浏览文件 @ d75e7ae4
......@@ -55,7 +55,7 @@
// QRCODE
qrcode = mesh = new THREE.Mesh( new Qrcode(), new THREE.MeshFaceMaterial() );
qrcode = mesh = new THREE.Mesh( new Qrcode(), new THREE.MeshLambertMaterial( { /*emissive: 0xff0000,*/ vertexColors: THREE.FaceColors } ) );
mesh.scale.x = mesh.scale.y = mesh.scale.z = 2;
scene.add( mesh );
......
examples/obj/Qrcode.js
浏览文件 @ d75e7ae4
此差异已折叠。
src/core/Projector.js
浏览文件 @ d75e7ae4
......@@ -352,6 +352,7 @@ THREE.Projector = function() {
}
_face.color = face.color;
_face.material = material;
_face.z = _face.centroidScreen.z;
......
src/renderers/CanvasRenderer.js
浏览文件 @ d75e7ae4
......@@ -41,6 +41,9 @@ THREE.CanvasRenderer = function ( parameters ) {
_color3 = new THREE.Color(),
_color4 = new THREE.Color(),
_diffuseColor = new THREE.Color(),
_emissiveColor = new THREE.Color(),
_patterns = {}, _imagedatas = {},
_near, _far,
......@@ -190,7 +193,9 @@ THREE.CanvasRenderer = function ( parameters ) {
var e, el, element, material;
this.autoClear === true ? this.clear() : _context.setTransform( 1, 0, 0, - 1, _canvasWidthHalf, _canvasHeightHalf );
this.autoClear === true
? this.clear()
: _context.setTransform( 1, 0, 0, - 1, _canvasWidthHalf, _canvasHeightHalf );
_this.info.render.vertices = 0;
_this.info.render.faces = 0;
......@@ -561,10 +566,18 @@ THREE.CanvasRenderer = function ( parameters ) {
if ( ( material instanceof THREE.MeshLambertMaterial || material instanceof THREE.MeshPhongMaterial ) && material.map === null && material.map === null ) {
if ( _enableLighting === true ) {
_diffuseColor.copy( material.color );
_emissiveColor.copy( material.emissive );
if ( material.vertexColors === THREE.FaceColors ) {
_diffuseColor.r *= element.color.r;
_diffuseColor.g *= element.color.g;
_diffuseColor.b *= element.color.b;
}
var diffuse = material.color;
var emissive = material.emissive;
if ( _enableLighting === true ) {
if ( material.wireframe === false && material.shading == THREE.SmoothShading && element.vertexNormalsLength == 3 ) {
......@@ -576,17 +589,17 @@ THREE.CanvasRenderer = function ( parameters ) {
calculateLight( element.v2.positionWorld, element.vertexNormalsWorld[ 1 ], _color2 );
calculateLight( element.v3.positionWorld, element.vertexNormalsWorld[ 2 ], _color3 );
_color1.r = diffuse.r * _color1.r + emissive.r;
_color1.g = diffuse.g * _color1.g + emissive.g;
_color1.b = diffuse.b * _color1.b + emissive.b;
_color1.r = _color1.r * _diffuseColor.r + _emissiveColor.r;
_color1.g = _color1.g * _diffuseColor.g + _emissiveColor.g;
_color1.b = _color1.b * _diffuseColor.b + _emissiveColor.b;
_color2.r = diffuse.r * _color2.r + emissive.r;
_color2.g = diffuse.g * _color2.g + emissive.g;
_color2.b = diffuse.b * _color2.b + emissive.b;
_color2.r = _color2.r * _diffuseColor.r + _emissiveColor.r;
_color2.g = _color2.g * _diffuseColor.g + _emissiveColor.g;
_color2.b = _color2.b * _diffuseColor.b + _emissiveColor.b;
_color3.r = diffuse.r * _color3.r + emissive.r;
_color3.g = diffuse.g * _color3.g + emissive.g;
_color3.b = diffuse.b * _color3.b + emissive.b;
_color3.r = _color3.r * _diffuseColor.r + _emissiveColor.r;
_color3.g = _color3.g * _diffuseColor.g + _emissiveColor.g;
_color3.b = _color3.b * _diffuseColor.b + _emissiveColor.b;
_color4.r = ( _color2.r + _color3.r ) * 0.5;
_color4.g = ( _color2.g + _color3.g ) * 0.5;
......@@ -604,17 +617,21 @@ THREE.CanvasRenderer = function ( parameters ) {
calculateLight( element.centroidWorld, element.normalWorld, _color );
_color.r = diffuse.r * _color.r + emissive.r;
_color.g = diffuse.g * _color.g + emissive.g;
_color.b = diffuse.b * _color.b + emissive.b;
_color.r = _color.r * _diffuseColor.r + _emissiveColor.r;
_color.g = _color.g * _diffuseColor.g + _emissiveColor.g;
_color.b = _color.b * _diffuseColor.b + _emissiveColor.b;
material.wireframe === true ? strokePath( _color, material.wireframeLinewidth, material.wireframeLinecap, material.wireframeLinejoin ) : fillPath( _color );
material.wireframe === true
? strokePath( _color, material.wireframeLinewidth, material.wireframeLinecap, material.wireframeLinejoin )
: fillPath( _color );
}
} else {
material.wireframe === true ? strokePath( material.color, material.wireframeLinewidth, material.wireframeLinecap, material.wireframeLinejoin ) : fillPath( material.color );
material.wireframe === true
? strokePath( material.color, material.wireframeLinewidth, material.wireframeLinecap, material.wireframeLinejoin )
: fillPath( material.color );
}
......@@ -659,7 +676,19 @@ THREE.CanvasRenderer = function ( parameters ) {
} else {
material.wireframe === true ? strokePath( material.color, material.wireframeLinewidth, material.wireframeLinecap, material.wireframeLinejoin ) : fillPath( material.color );
_color.copy( material.color );
if ( material.vertexColors === THREE.FaceColors ) {
_color.r *= element.color.r;
_color.g *= element.color.g;
_color.b *= element.color.b;
}
material.wireframe === true
? strokePath( _color, material.wireframeLinewidth, material.wireframeLinecap, material.wireframeLinejoin )
: fillPath( _color );
}
......@@ -686,7 +715,9 @@ THREE.CanvasRenderer = function ( parameters ) {
_color.g = normalToComponent( element.normalWorld.y );
_color.b = normalToComponent( element.normalWorld.z );
material.wireframe === true ? strokePath( _color, material.wireframeLinewidth, material.wireframeLinecap, material.wireframeLinejoin ) : fillPath( _color );
material.wireframe === true
? strokePath( _color, material.wireframeLinewidth, material.wireframeLinecap, material.wireframeLinejoin )
: fillPath( _color );
}
......@@ -720,10 +751,18 @@ THREE.CanvasRenderer = function ( parameters ) {
if ( material instanceof THREE.MeshLambertMaterial || material instanceof THREE.MeshPhongMaterial ) {
if ( _enableLighting === true ) {
_diffuseColor.copy( material.color );
_emissiveColor.copy( material.emissive );
if ( material.vertexColors === THREE.FaceColors ) {
_diffuseColor.r *= element.color.r;
_diffuseColor.g *= element.color.g;
_diffuseColor.b *= element.color.b;
var diffuse = material.color;
var emissive = material.emissive;
}
if ( _enableLighting === true ) {
if ( material.wireframe === false && material.shading == THREE.SmoothShading && element.vertexNormalsLength == 4 ) {
......@@ -736,21 +775,21 @@ THREE.CanvasRenderer = function ( parameters ) {
calculateLight( element.v4.positionWorld, element.vertexNormalsWorld[ 3 ], _color3 );
calculateLight( element.v3.positionWorld, element.vertexNormalsWorld[ 2 ], _color4 );
_color1.r = diffuse.r * _color1.r + emissive.r;
_color1.g = diffuse.g * _color1.g + emissive.g;
_color1.b = diffuse.b * _color1.b + emissive.b;
_color1.r = _color1.r * _diffuseColor.r + _emissiveColor.r;
_color1.g = _color1.g * _diffuseColor.g + _emissiveColor.g;
_color1.b = _color1.b * _diffuseColor.b + _emissiveColor.b;
_color2.r = diffuse.r * _color2.r + emissive.r;
_color2.g = diffuse.g * _color2.g + emissive.g;
_color2.b = diffuse.b * _color2.b + emissive.b;
_color2.r = _color2.r * _diffuseColor.r + _emissiveColor.r;
_color2.g = _color2.g * _diffuseColor.g + _emissiveColor.g;
_color2.b = _color2.b * _diffuseColor.b + _emissiveColor.b;
_color3.r = diffuse.r * _color3.r + emissive.r;
_color3.g = diffuse.g * _color3.g + emissive.g;
_color3.b = diffuse.b * _color3.b + emissive.b;
_color3.r = _color3.r * _diffuseColor.r + _emissiveColor.r;
_color3.g = _color3.g * _diffuseColor.g + _emissiveColor.g;
_color3.b = _color3.b * _diffuseColor.b + _emissiveColor.b;
_color4.r = diffuse.r * _color4.r + emissive.r;
_color4.g = diffuse.g * _color4.g + emissive.g;
_color4.b = diffuse.b * _color4.b + emissive.b;
_color4.r = _color4.r * _diffuseColor.r + _emissiveColor.r;
_color4.g = _color4.g * _diffuseColor.g + _emissiveColor.g;
_color4.b = _color4.b * _diffuseColor.b + _emissiveColor.b;
_image = getGradientTexture( _color1, _color2, _color3, _color4 );
......@@ -770,29 +809,49 @@ THREE.CanvasRenderer = function ( parameters ) {
calculateLight( element.centroidWorld, element.normalWorld, _color );
_color.r = diffuse.r * _color.r + emissive.r;
_color.g = diffuse.g * _color.g + emissive.g;
_color.b = diffuse.b * _color.b + emissive.b;
_color.r = _color.r * _diffuseColor.r + _emissiveColor.r;
_color.g = _color.g * _diffuseColor.g + _emissiveColor.g;
_color.b = _color.b * _diffuseColor.b + _emissiveColor.b;
drawQuad( _v1x, _v1y, _v2x, _v2y, _v3x, _v3y, _v4x, _v4y );
material.wireframe === true ? strokePath( _color, material.wireframeLinewidth, material.wireframeLinecap, material.wireframeLinejoin ) : fillPath( _color );
material.wireframe === true
? strokePath( _color, material.wireframeLinewidth, material.wireframeLinecap, material.wireframeLinejoin )
: fillPath( _color );
}
} else {
_color.r = _diffuseColor.r + _emissiveColor.r;
_color.g = _diffuseColor.g + _emissiveColor.g;
_color.b = _diffuseColor.b + _emissiveColor.b;
drawQuad( _v1x, _v1y, _v2x, _v2y, _v3x, _v3y, _v4x, _v4y );
material.wireframe === true ? strokePath( material.color, material.wireframeLinewidth, material.wireframeLinecap, material.wireframeLinejoin ) : fillPath( material.color );
material.wireframe === true
? strokePath( _color, material.wireframeLinewidth, material.wireframeLinecap, material.wireframeLinejoin )
: fillPath( _color );
}
} else if ( material instanceof THREE.MeshBasicMaterial ) {
_color.copy( material.color );
if ( material.vertexColors === THREE.FaceColors ) {
_color.r *= element.color.r;
_color.g *= element.color.g;
_color.b *= element.color.b;
}
drawQuad( _v1x, _v1y, _v2x, _v2y, _v3x, _v3y, _v4x, _v4y );
material.wireframe === true ? strokePath( material.color, material.wireframeLinewidth, material.wireframeLinecap, material.wireframeLinejoin ) : fillPath( material.color );
material.wireframe === true
? strokePath( _color, material.wireframeLinewidth, material.wireframeLinecap, material.wireframeLinejoin )
: fillPath( _color );
} else if ( material instanceof THREE.MeshNormalMaterial ) {
......@@ -802,7 +861,9 @@ THREE.CanvasRenderer = function ( parameters ) {
drawQuad( _v1x, _v1y, _v2x, _v2y, _v3x, _v3y, _v4x, _v4y );
material.wireframe === true ? strokePath( _color, material.wireframeLinewidth, material.wireframeLinecap, material.wireframeLinejoin ) : fillPath( _color );
material.wireframe === true
? strokePath( _color, material.wireframeLinewidth, material.wireframeLinecap, material.wireframeLinejoin )
: fillPath( _color );
} else if ( material instanceof THREE.MeshDepthMaterial ) {
......
src/renderers/renderables/RenderableFace3.js
浏览文件 @ d75e7ae4
......@@ -15,6 +15,7 @@ THREE.RenderableFace3 = function () {
this.vertexNormalsWorld = [ new THREE.Vector3(), new THREE.Vector3(), new THREE.Vector3() ];
this.vertexNormalsLength = 0;
this.color = null;
this.material = null;
this.uvs = [[]];
......
src/renderers/renderables/RenderableFace4.js
浏览文件 @ d75e7ae4
......@@ -16,6 +16,7 @@ THREE.RenderableFace4 = function () {
this.vertexNormalsWorld = [ new THREE.Vector3(), new THREE.Vector3(), new THREE.Vector3(), new THREE.Vector3() ];
this.vertexNormalsLength = 0;
this.color = null;
this.material = null;
this.uvs = [[]];
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或