Skip to content

T
three.js

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

从无法访问的项目Fork

通知 2
Star 0
Fork 0
T
three.js

前往新版Gitcode，体验更适合开发者的 AI 搜索 >>

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

Better handling of Color

上级 30672c1f
展开全部 隐藏空白更改
内联 并排
Showing with 82 addition and 44 deletion
README.md
浏览文件 @ 271ad498
...@@ -25,10 +25,10 @@ ...@@ -25,10 +25,10 @@
for (var i = 0; i < 1000; i++) for (var i = 0; i < 1000; i++)
{ {
var particle = new Particle( new ColorMaterial(Math.random() * 0x808008 + 0x808080, 1) ); var particle = new Particle( new ColorMaterial(Math.random() * 0x808008 + 0x808080, 1) );
particle.size = Math.random() * 10 + 5;
particle.position.x = Math.random() * 2000 - 1000; particle.position.x = Math.random() * 2000 - 1000;
particle.position.y = Math.random() * 2000 - 1000; particle.position.y = Math.random() * 2000 - 1000;
particle.position.z = Math.random() * 2000 - 1000; particle.position.z = Math.random() * 2000 - 1000;
particle.size = Math.random() * 10 + 5;
particle.updateMatrix(); particle.updateMatrix();
scene.add( particle ); scene.add( particle );
} }
......
build/three.js
浏览文件 @ 271ad498
此差异已折叠。
examples/particles/floor.html
浏览文件 @ 271ad498
...@@ -18,6 +18,7 @@ ...@@ -18,6 +18,7 @@
</style> </style>
</head> </head>
<body> <body>
<script type="text/javascript" src="http://github.com/mrdoob/three.js/raw/master/build/three.js"></script> <script type="text/javascript" src="http://github.com/mrdoob/three.js/raw/master/build/three.js"></script>
<script type="text/javascript" src="http://github.com/mrdoob/stats.js/raw/master/build/stats.js"></script> <script type="text/javascript" src="http://github.com/mrdoob/stats.js/raw/master/build/stats.js"></script>
...@@ -30,8 +31,8 @@ ...@@ -30,8 +31,8 @@
var AMOUNTX = 50; var AMOUNTX = 50;
var AMOUNTY = 50; var AMOUNTY = 50;
var stats;
var container; var container;
var stats;
var particle; var particle;
...@@ -55,7 +56,7 @@ ...@@ -55,7 +56,7 @@
function init() function init()
{ {
container = document.createElement('div'); container = document.createElement('div');
document.body.appendChild(container); document.body.appendChild(container);
camera = new Camera(0, 0, 1000); camera = new Camera(0, 0, 1000);
camera.focus = 200; camera.focus = 200;
......
src/core/Color.js 0 → 100644
浏览文件 @ 271ad498
var Color = Class.extend
({
r: null, g: null, b: null, a: null,
hex: null,
styleString: null,
init: function( hex )
{
this.setHex( hex ? hex : 0xff000000 );
},
setHex: function( hex )
{
this.hex = hex;
this.updateRGBA();
this.updateStyleString();
},
setRGBA: function( r, g, b, a )
{
this.r = r;
this.g = g;
this.b = b;
this.a = a;
this.updateHex();
this.updateStyleString();
},
updateHex: function()
{
this.hex = this.a << 24 | this.r << 16 | this.g << 8 | this.b;
},
updateRGBA: function()
{
this.r = this.hex >> 16 & 0xff;
this.g = this.hex >> 8 & 0xff;
this.b = this.hex & 0xff;
this.a = this.hex >> 24 & 0xff;
},
updateStyleString: function()
{
this.styleString = 'rgba(' + this.r + ',' + this.g + ',' + this.b + ',' + (this.a / 255) + ')';
},
toString: function()
{
return 'Color ( r: ' + this.r + ', g: ' + this.g + ', b: ' + this.b + ', a: ' + this.a + ', hex: ' + this.hex + ', style: ' + this.styleString + ' )';
}
});
src/core/Face3.js
浏览文件 @ 271ad498
...@@ -5,7 +5,6 @@ var Face3 = Vector3.extend ...@@ -5,7 +5,6 @@ var Face3 = Vector3.extend
uv: null, uv: null,
normal: null, normal: null,
color: null, color: null,
colorString: null,
init: function(a, b, c, uv, normal, color) init: function(a, b, c, uv, normal, color)
{ {
...@@ -20,12 +19,11 @@ var Face3 = Vector3.extend ...@@ -20,12 +19,11 @@ var Face3 = Vector3.extend
this.uv = uv ? uv : [ [0, 0], [0, 0], [0, 0] ]; this.uv = uv ? uv : [ [0, 0], [0, 0], [0, 0] ];
this.normal = normal ? normal : new Vector3(); this.normal = normal ? normal : new Vector3();
this.color = color ? color : [0, 0, 0]; this.color = color ? color : new Color();
this.colorString = 'rgb(' + this.color[0] + ', ' + this.color[1] + ', ' + this.color[2] + ')';
}, },
toString: function() toString: function()
{ {
return 'Face ( ' + this.a + ', ' + this.b + ', ' + this.c + ' )'; return 'Face3 ( ' + this.a + ', ' + this.b + ', ' + this.c + ' )';
} }
}); });
src/core/Face4.js
浏览文件 @ 271ad498
...@@ -4,7 +4,6 @@ var Face4 = Vector3.extend ...@@ -4,7 +4,6 @@ var Face4 = Vector3.extend
normal: null, normal: null,
screen: null, screen: null,
color: null, color: null,
colorString: null,
init: function(a, b, c, d, uv, normal, color) init: function(a, b, c, d, uv, normal, color)
{ {
...@@ -17,12 +16,11 @@ var Face4 = Vector3.extend ...@@ -17,12 +16,11 @@ var Face4 = Vector3.extend
this.screen = new Vector3(); this.screen = new Vector3();
this.color = color ? color : [0, 0, 0]; this.color = color ? color : new Color();
this.colorString = 'rgb(' + this.color[0] + ', ' + this.color[1] + ', ' + this.color[2] + ')';
}, },
toString: function() toString: function()
{ {
return 'Face ( ' + this.a + ', ' + this.b + ', ' + this.c + ' )'; return 'Face4 ( ' + this.a + ', ' + this.b + ', ' + this.c + ', ' + this.d + ' )';
} }
}); });
src/materials/ColorMaterial.js
浏览文件 @ 271ad498
var ColorMaterial = Class.extend var ColorMaterial = Class.extend
({ ({
color: null, color: null,
opacity: null,
colorString: null,
// Uses hex instead of rgb is for keeping the syntax similar to .as version init: function( hex, opacity )
init: function( color, opacity )
{
this.setColor( color ? color : 0xff0000 );
this.setOpacity( opacity ? opacity : 1 );
},
setColor: function( color )
{ {
this.color = color; this.color = new Color( (opacity ? (opacity * 0xff) << 24 : 0xff000000) | hex );
this.updateColorString();
},
setOpacity: function( opacity )
{
this.opacity = opacity;
this.updateColorString();
},
updateColorString: function()
{
this.colorString = 'rgba(' + (this.color >> 16 & 0xff) + ',' + (this.color >> 8 & 0xff) + ',' + (this.color & 0xff) + ',' + this.opacity + ')';
} }
}); });
src/materials/FaceColorMaterial.js 0 → 100755
浏览文件 @ 271ad498
var FaceColorMaterial = Class.extend
({
});
src/renderers/CanvasRenderer.js
浏览文件 @ 271ad498
...@@ -34,7 +34,11 @@ var CanvasRenderer = Renderer.extend ...@@ -34,7 +34,11 @@ var CanvasRenderer = Renderer.extend
if (element.material instanceof ColorMaterial) if (element.material instanceof ColorMaterial)
{ {
this.context.fillStyle = element.material.colorString; this.context.fillStyle = element.material.color.styleString;
}
else if (element.material instanceof FaceColorMaterial)
{
this.context.fillStyle = element.color.styleString;
} }
if (element instanceof Face3) if (element instanceof Face3)
......
src/renderers/Renderer.js
浏览文件 @ 271ad498
...@@ -84,7 +84,7 @@ var Renderer = Class.extend ...@@ -84,7 +84,7 @@ var Renderer = Class.extend
(face.c.screen.x - face.a.screen.x) * (face.b.screen.y - face.a.screen.y) - (face.c.screen.x - face.a.screen.x) * (face.b.screen.y - face.a.screen.y) -
(face.c.screen.y - face.a.screen.y) * (face.b.screen.x - face.a.screen.x) > 0) ) (face.c.screen.y - face.a.screen.y) * (face.b.screen.x - face.a.screen.x) > 0) )
{ {
face.screen.z = Math.max(face.a.screen.z, Math.max(face.b.screen.z, face.c.screen.z)); face.screen.z = (face.a.screen.z + face.b.screen.z + face.c.screen.z) * 0.3;
if (this.face3Pool[face3count] == null) if (this.face3Pool[face3count] == null)
this.face3Pool[face3count] = new Face3(new Vertex(), new Vertex(), new Vertex()); this.face3Pool[face3count] = new Face3(new Vertex(), new Vertex(), new Vertex());
...@@ -93,7 +93,8 @@ var Renderer = Class.extend ...@@ -93,7 +93,8 @@ var Renderer = Class.extend
this.face3Pool[face3count].b.screen.copy(face.b.screen); this.face3Pool[face3count].b.screen.copy(face.b.screen);
this.face3Pool[face3count].c.screen.copy(face.c.screen); this.face3Pool[face3count].c.screen.copy(face.c.screen);
this.face3Pool[face3count].screen.z = face.screen.z; this.face3Pool[face3count].screen.z = face.screen.z;
this.face3Pool[face3count].material = face.material; this.face3Pool[face3count].color = face.color;
this.face3Pool[face3count].material = object.material;
this.renderList.push( this.face3Pool[face3count] ); this.renderList.push( this.face3Pool[face3count] );
...@@ -108,7 +109,7 @@ var Renderer = Class.extend ...@@ -108,7 +109,7 @@ var Renderer = Class.extend
(face.b.screen.x - face.c.screen.x) * (face.d.screen.y - face.c.screen.y) - (face.b.screen.x - face.c.screen.x) * (face.d.screen.y - face.c.screen.y) -
(face.b.screen.y - face.c.screen.y) * (face.d.screen.x - face.c.screen.x) > 0)) ) (face.b.screen.y - face.c.screen.y) * (face.d.screen.x - face.c.screen.x) > 0)) )
{ {
face.screen.z = Math.max(face.a.screen.z, Math.max(face.b.screen.z, face.c.screen.z)); face.screen.z = (face.a.screen.z + face.b.screen.z + face.c.screen.z + face.d.screen.z) * 0.25;
if (this.face4Pool[face4count] == null) if (this.face4Pool[face4count] == null)
this.face4Pool[face4count] = new Face4(new Vertex(), new Vertex(), new Vertex(), new Vertex()); this.face4Pool[face4count] = new Face4(new Vertex(), new Vertex(), new Vertex(), new Vertex());
...@@ -118,7 +119,8 @@ var Renderer = Class.extend ...@@ -118,7 +119,8 @@ var Renderer = Class.extend
this.face4Pool[face4count].c.screen.copy(face.c.screen); this.face4Pool[face4count].c.screen.copy(face.c.screen);
this.face4Pool[face4count].d.screen.copy(face.d.screen); this.face4Pool[face4count].d.screen.copy(face.d.screen);
this.face4Pool[face4count].screen.z = face.screen.z; this.face4Pool[face4count].screen.z = face.screen.z;
this.face4Pool[face4count].material = face.material; this.face4Pool[face4count].color = face.color;
this.face4Pool[face4count].material = object.material;
this.renderList.push( this.face4Pool[face4count] ); this.renderList.push( this.face4Pool[face4count] );
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或