Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
Ablesons
three.js
提交
aa8bdaea
T
three.js
项目概览
Ablesons
/
three.js
与 Fork 源项目一致
从无法访问的项目Fork
通知
2
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
T
three.js
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
aa8bdaea
编写于
2月 02, 2011
作者:
A
alteredq
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
Moved film shader into ShaderUtils.
上级
84d1b582
变更
3
隐藏空白更改
内联
并排
Showing
3 changed file
with
112 addition
and
79 deletion
+112
-79
build/ThreeExtras.js
build/ThreeExtras.js
+1
-0
examples/postprocessing.html
examples/postprocessing.html
+9
-67
src/extras/ShaderUtils.js
src/extras/ShaderUtils.js
+102
-12
未找到文件。
build/ThreeExtras.js
浏览文件 @
aa8bdaea
...
...
@@ -229,6 +229,7 @@ uDirLightColor:{type:"c",value:new THREE.Color(15658734)},uAmbientLightColor:{ty
vertex_shader
:
"
attribute vec4 tangent;
\n
uniform vec3 uPointLightPos;
\n
#ifdef VERTEX_TEXTURES
\n
uniform sampler2D tDisplacement;
\n
uniform float uDisplacementScale;
\n
uniform float uDisplacementBias;
\n
#endif
\n
varying vec3 vTangent;
\n
varying vec3 vBinormal;
\n
varying vec3 vNormal;
\n
varying vec2 vUv;
\n
varying vec3 vPointLightVector;
\n
varying vec3 vViewPosition;
\n
void main() {
\n
vec4 mPosition = objectMatrix * vec4( position, 1.0 );
\n
vViewPosition = cameraPosition - mPosition.xyz;
\n
vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );
\n
vNormal = normalize( normalMatrix * normal );
\n
vTangent = normalize( normalMatrix * tangent.xyz );
\n
vBinormal = cross( vNormal, vTangent ) * tangent.w;
\n
vBinormal = normalize( vBinormal );
\n
vUv = uv;
\n
vec4 lPosition = viewMatrix * vec4( uPointLightPos, 1.0 );
\n
vPointLightVector = normalize( lPosition.xyz - mvPosition.xyz );
\n
#ifdef VERTEX_TEXTURES
\n
vec3 dv = texture2D( tDisplacement, uv ).xyz;
\n
float df = uDisplacementScale * dv.x + uDisplacementBias;
\n
vec4 displacedPosition = vec4( vNormal.xyz * df, 0.0 ) + mvPosition;
\n
gl_Position = projectionMatrix * displacedPosition;
\n
#else
\n
gl_Position = projectionMatrix * mvPosition;
\n
#endif
\n
}
"
},
cube
:{
uniforms
:{
tCube
:{
type
:
"
t
"
,
value
:
1
,
texture
:
null
}},
vertex_shader
:
"
varying vec3 vViewPosition;
\n
void main() {
\n
vec4 mPosition = objectMatrix * vec4( position, 1.0 );
\n
vViewPosition = cameraPosition - mPosition.xyz;
\n
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
\n
}
"
,
fragment_shader
:
"
uniform samplerCube tCube;
\n
varying vec3 vViewPosition;
\n
void main() {
\n
vec3 wPos = cameraPosition - vViewPosition;
\n
gl_FragColor = textureCube( tCube, vec3( - wPos.x, wPos.yz ) );
\n
}
"
},
convolution
:{
uniforms
:{
tDiffuse
:{
type
:
"
t
"
,
value
:
0
,
texture
:
null
},
uImageIncrement
:{
type
:
"
v2
"
,
value
:
new
THREE
.
Vector2
(
0.001953125
,
0
)},
cKernel
:{
type
:
"
fv1
"
,
value
:[]}},
vertex_shader
:
"
varying vec2 vUv;
\n
uniform vec2 uImageIncrement;
\n
#define KERNEL_SIZE 25.0
\n
void main(void) {
\n
vUv = uv - ((KERNEL_SIZE - 1.0) / 2.0) * uImageIncrement;
\n
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
\n
}
"
,
fragment_shader
:
"
varying vec2 vUv;
\n
uniform sampler2D tDiffuse;
\n
uniform vec2 uImageIncrement;
\n
#define KERNEL_SIZE 25
\n
uniform float cKernel[KERNEL_SIZE];
\n
void main(void) {
\n
vec2 imageCoord = vUv;
\n
vec4 sum = vec4( 0.0, 0.0, 0.0, 0.0 );
\n
for( int i=0; i<KERNEL_SIZE; ++i ) {
\n
sum += texture2D( tDiffuse, imageCoord ) * cKernel[i];
\n
imageCoord += uImageIncrement;
\n
}
\n
gl_FragColor = sum;
\n
}
"
},
film
:{
uniforms
:{
tDiffuse
:{
type
:
"
t
"
,
value
:
0
,
texture
:
null
},
time
:{
type
:
"
f
"
,
value
:
0
}},
vertex_shader
:
"
varying vec2 vUv;
\n
void main() {
\n
vUv = vec2( uv.x, 1.0 - uv.y );
\n
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
\n
}
"
,
fragment_shader
:
"
varying vec2 vUv;
\n
uniform sampler2D tDiffuse;
\n
uniform float time;
\n
const float fNintensity = 0.35;
\n
const float fSintensity = 0.35;
\n
const float fScount = 4096.0;
\n
void main() {
\n
vec4 cTextureScreen = texture2D( tDiffuse, vUv );
\n
float x = vUv.x * vUv.y * time * 1000.0;
\n
x = mod( x, 13.0 ) * mod( x, 123.0 );
\n
float dx = mod( x, 0.01 );
\n
vec3 cResult = cTextureScreen.rgb + cTextureScreen.rgb * clamp( 0.1 + dx * 100.0, 0.0, 1.0 );
\n
vec2 sc = vec2( sin(vUv.y * fScount), cos(vUv.y * fScount) );
\n
cResult += cTextureScreen.rgb * vec3( sc.x, sc.y, sc.x ) * fSintensity;
\n
cResult = cTextureScreen.rgb + clamp( fNintensity, 0.0,1.0 ) * ( cResult - cTextureScreen.rgb );
\n
cResult = vec3( cResult.r * 0.3 + cResult.g * 0.59 + cResult.b * 0.11 );
\n
gl_FragColor = vec4( cResult, cTextureScreen.a );
\n
}
"
},
screen
:{
uniforms
:{
tDiffuse
:{
type
:
"
t
"
,
value
:
0
,
texture
:
null
},
opacity
:{
type
:
"
f
"
,
value
:
1
}},
vertex_shader
:
"
varying vec2 vUv;
\n
void main() {
\n
vUv = vec2( uv.x, 1.0 - uv.y );
\n
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
\n
}
"
,
fragment_shader
:
"
varying vec2 vUv;
\n
uniform sampler2D tDiffuse;
\n
uniform float opacity;
\n
void main() {
\n
vec4 texel = texture2D( tDiffuse, vUv );
\n
gl_FragColor = opacity * texel;
\n
}
"
},
basic
:{
uniforms
:{},
vertex_shader
:
"
void main() {
\n
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
\n
}
"
,
fragment_shader
:
"
void main() {
\n
gl_FragColor = vec4( 1.0, 0.0, 0.0, 0.5 );
\n
}
"
}},
buildKernel
:
function
(
a
){
var
c
,
d
,
e
,
g
,
b
=
2
*
Math
.
ceil
(
a
*
3
)
+
1
;
if
(
b
>
25
)
b
=
25
;
g
=
(
b
-
1
)
*
0.5
;
d
=
Array
(
b
);
for
(
c
=
e
=
0
;
c
<
b
;
++
c
){
d
[
c
]
=
Math
.
exp
(
-
((
c
-
g
)
*
(
c
-
g
))
/
(
2
*
a
*
a
));
e
+=
d
[
c
]}
for
(
c
=
0
;
c
<
b
;
++
c
)
d
[
c
]
/=
e
;
return
d
}},
Cube
=
function
(
a
,
c
,
d
,
e
,
g
,
b
,
l
,
j
){
function
h
(
B
,
G
,
t
,
k
,
f
,
m
,
n
,
C
){
var
w
,
p
,
F
=
e
||
1
,
y
=
g
||
1
,
J
=
F
+
1
,
E
=
y
+
1
,
A
=
f
/
2
,
M
=
m
/
2
;
f
=
f
/
F
;
var
aa
=
m
/
y
,
N
=
o
.
vertices
.
length
;
if
(
B
==
"
x
"
&&
G
==
"
y
"
||
B
==
"
y
"
&&
G
==
"
x
"
)
w
=
"
z
"
;
else
if
(
B
==
"
x
"
&&
G
==
"
z
"
||
B
==
"
z
"
&&
G
==
"
x
"
)
w
=
"
y
"
;
else
if
(
B
==
"
z
"
&&
G
==
"
y
"
||
B
==
"
y
"
&&
G
==
"
z
"
)
w
=
"
x
"
;
for
(
p
=
0
;
p
<
E
;
p
++
)
for
(
m
=
0
;
m
<
J
;
m
++
){
var
U
=
new
THREE
.
Vector3
;
U
[
B
]
=
(
m
*
f
-
A
)
*
t
;
U
[
G
]
=
(
p
*
aa
-
M
)
*
k
;
U
[
w
]
=
n
;
o
.
vertices
.
push
(
new
THREE
.
Vertex
(
U
))}
for
(
p
=
0
;
p
<
y
;
p
++
)
for
(
m
=
0
;
m
<
F
;
m
++
){
o
.
faces
.
push
(
new
THREE
.
Face4
(
m
+
J
*
p
+
N
,
m
+
J
*
(
p
+
1
)
+
N
,
m
+
1
+
J
*
(
p
+
1
)
+
N
,
m
+
1
+
J
*
p
+
N
,
null
,
C
));
o
.
uvs
.
push
([
new
THREE
.
UV
(
m
/
F
,
p
/
y
),
new
THREE
.
UV
(
m
/
F
,(
p
+
1
)
/
y
),
new
THREE
.
UV
((
m
+
1
)
/
F
,(
p
+
1
)
/
y
),
new
THREE
.
UV
((
m
+
1
)
/
F
,
p
/
y
)])}}
THREE
.
Geometry
.
call
(
this
);
var
o
=
this
,
v
=
a
/
2
,
z
=
c
/
2
,
u
=
d
/
2
;
l
=
l
?
-
1
:
1
;
if
(
b
!==
undefined
)
if
(
b
instanceof
...
...
examples/postprocessing.html
浏览文件 @
aa8bdaea
...
...
@@ -65,68 +65,6 @@
<script
type=
"text/javascript"
src=
"js/Stats.js"
></script>
<script
type=
"text/javascript"
src=
"../build/ThreeExtras.js"
></script>
<!-- -----------------------------------------------------------------
Film grain & scanlines shader
- ported from HLSL to WebGL / GLSL
http://www.truevision3d.com/forums/showcase/staticnoise_colorblackwhite_scanline_shaders-t18698.0.html
// Screen Space Static Postprocessor
//
// Produces an analogue noise overlay similar to a film grain / TV static
//
// Original implementation and noise algorithm
// Pat 'Hawthorne' Shearon
//
// Optimized scanlines + noise version with intensity scaling
// Georg 'Leviathan' Steinrohder
// This version is provided under a Creative Commons Attribution 3.0 License
// http://creativecommons.org/licenses/by/3.0/
----------------------------------------------------------------- -->
<!-- Film grain & scanlines fragment shader -->
<script
id=
"fs-film"
type=
"x-shader/x-fragment"
>
varying
vec2
vUv
;
uniform
sampler2D
tDiffuse
;
// control parameter
uniform
float
time
;
// noise effect intensity value (0 = no effect, 1 = full effect)
const
float
fNintensity
=
0.35
;
// scanlines effect intensity value (0 = no effect, 1 = full effect)
const
float
fSintensity
=
0.35
;
// scanlines effect count value (0 = no effect, 4096 = full effect)
const
float
fScount
=
4096.0
;
void
main
(
void
)
{
// sample the source
vec4
cTextureScreen
=
texture2D
(
tDiffuse
,
vUv
);
// make some noise
float
x
=
vUv
.
x
*
vUv
.
y
*
time
*
1000.0
;
x
=
mod
(
x
,
13.0
)
*
mod
(
x
,
123.0
);
float
dx
=
mod
(
x
,
0.01
);
// add noise
vec3
cResult
=
cTextureScreen
.
rgb
+
cTextureScreen
.
rgb
*
clamp
(
0.1
+
dx
*
100.0
,
0.0
,
1.0
);
// get us a sine and cosine
vec2
sc
=
vec2
(
sin
(
vUv
.
y
*
fScount
),
cos
(
vUv
.
y
*
fScount
)
);
// add scanlines
cResult
+=
cTextureScreen
.
rgb
*
vec3
(
sc
.
x
,
sc
.
y
,
sc
.
x
)
*
fSintensity
;
// interpolate between source and result by intensity
cResult
=
cTextureScreen
.
rgb
+
clamp
(
fNintensity
,
0.0
,
1.0
)
*
(
cResult
-
cTextureScreen
.
rgb
);
// convert to grayscale if desired
cResult
=
vec3
(
cResult
.
r
*
0.3
+
cResult
.
g
*
0.59
+
cResult
.
b
*
0.11
);
gl_FragColor
=
vec4
(
cResult
,
cTextureScreen
.
a
);
}
</script>
<!-- Time modulated procedural color fragment shader -->
<script
id=
"fs-colors"
type=
"x-shader/x-fragment"
>
...
...
@@ -220,16 +158,20 @@
}
);
var
film_shader
=
ShaderUtils
.
lib
[
"
film
"
];
var
film_uniforms
=
Uniforms
.
clone
(
film_shader
.
uniforms
);
film_uniforms
[
"
tDiffuse
"
].
texture
=
rtTexture1
;
materialFilm
=
new
THREE
.
MeshShaderMaterial
(
{
uniforms
:
{
tDiffuse
:
{
type
:
"
t
"
,
value
:
0
,
texture
:
rtTexture1
},
time
:
{
type
:
"
f
"
,
value
:
0.0
}
},
vertex_shader
:
getText
(
'
vs-generic
'
),
fragment_shader
:
getText
(
'
fs-film
'
)
uniforms
:
film_uniforms
,
vertex_shader
:
film_shader
.
vertex_shader
,
fragment_shader
:
film_shader
.
fragment_shader
}
);
var
increment
=
0.001953125
;
blurx
=
new
THREE
.
Vector2
(
increment
,
0.0
),
...
...
src/extras/ShaderUtils.js
浏览文件 @
aa8bdaea
...
...
@@ -3,8 +3,8 @@ var ShaderUtils = {
lib
:
{
/* -------------------------------------------------------------------------
Fresnel shader
- based on Nvidia Cg tutorial
//
Fresnel shader
//
- based on Nvidia Cg tutorial
------------------------------------------------------------------------- */
'
fresnel
'
:
{
...
...
@@ -78,10 +78,10 @@ var ShaderUtils = {
},
/* -------------------------------------------------------------------------
Normal map shader
- Blinn-Phong
- normal + diffuse + AO + displacement maps
- 1 point and 1 directional lights
//
Normal map shader
//
- Blinn-Phong
//
- normal + diffuse + AO + displacement maps
//
- 1 point and 1 directional lights
------------------------------------------------------------------------- */
'
normal
'
:
{
...
...
@@ -282,7 +282,7 @@ var ShaderUtils = {
},
/* -------------------------------------------------------------------------
Cube map shader
//
Cube map shader
------------------------------------------------------------------------- */
'
cube
'
:
{
...
...
@@ -322,9 +322,9 @@ var ShaderUtils = {
},
/* ------------------------------------------------------------------------
Convolution shader
- ported from o3d sample to WebGL / GLSL
http://o3d.googlecode.com/svn/trunk/samples/convolution.html
//
Convolution shader
//
- ported from o3d sample to WebGL / GLSL
//
http://o3d.googlecode.com/svn/trunk/samples/convolution.html
------------------------------------------------------------------------ */
'
convolution
'
:
{
...
...
@@ -380,7 +380,97 @@ var ShaderUtils = {
},
/* -------------------------------------------------------------------------
Full-screen textured quad shader
// Film grain & scanlines shader
// - ported from HLSL to WebGL / GLSL
// http://www.truevision3d.com/forums/showcase/staticnoise_colorblackwhite_scanline_shaders-t18698.0.html
// Screen Space Static Postprocessor
//
// Produces an analogue noise overlay similar to a film grain / TV static
//
// Original implementation and noise algorithm
// Pat 'Hawthorne' Shearon
//
// Optimized scanlines + noise version with intensity scaling
// Georg 'Leviathan' Steinrohder
// This version is provided under a Creative Commons Attribution 3.0 License
// http://creativecommons.org/licenses/by/3.0/
------------------------------------------------------------------------- */
'
film
'
:
{
uniforms
:
{
tDiffuse
:
{
type
:
"
t
"
,
value
:
0
,
texture
:
null
},
time
:
{
type
:
"
f
"
,
value
:
0.0
}
},
vertex_shader
:
[
"
varying vec2 vUv;
"
,
"
void main() {
"
,
"
vUv = vec2( uv.x, 1.0 - uv.y );
"
,
"
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
"
,
"
}
"
].
join
(
"
\n
"
),
fragment_shader
:
[
"
varying vec2 vUv;
"
,
"
uniform sampler2D tDiffuse;
"
,
// control parameter
"
uniform float time;
"
,
// noise effect intensity value (0 = no effect, 1 = full effect)
"
const float fNintensity = 0.35;
"
,
// scanlines effect intensity value (0 = no effect, 1 = full effect)
"
const float fSintensity = 0.35;
"
,
// scanlines effect count value (0 = no effect, 4096 = full effect)
"
const float fScount = 4096.0;
"
,
"
void main() {
"
,
// sample the source
"
vec4 cTextureScreen = texture2D( tDiffuse, vUv );
"
,
// make some noise
"
float x = vUv.x * vUv.y * time * 1000.0;
"
,
"
x = mod( x, 13.0 ) * mod( x, 123.0 );
"
,
"
float dx = mod( x, 0.01 );
"
,
// add noise
"
vec3 cResult = cTextureScreen.rgb + cTextureScreen.rgb * clamp( 0.1 + dx * 100.0, 0.0, 1.0 );
"
,
// get us a sine and cosine
"
vec2 sc = vec2( sin(vUv.y * fScount), cos(vUv.y * fScount) );
"
,
// add scanlines
"
cResult += cTextureScreen.rgb * vec3( sc.x, sc.y, sc.x ) * fSintensity;
"
,
// interpolate between source and result by intensity
"
cResult = cTextureScreen.rgb + clamp( fNintensity, 0.0,1.0 ) * ( cResult - cTextureScreen.rgb );
"
,
// convert to grayscale if desired
"
cResult = vec3( cResult.r * 0.3 + cResult.g * 0.59 + cResult.b * 0.11 );
"
,
"
gl_FragColor = vec4( cResult, cTextureScreen.a );
"
,
"
}
"
].
join
(
"
\n
"
)
},
/* -------------------------------------------------------------------------
// Full-screen textured quad shader
------------------------------------------------------------------------- */
'
screen
'
:
{
...
...
@@ -421,7 +511,7 @@ var ShaderUtils = {
/* -------------------------------------------------------------------------
Simple test shader
//
Simple test shader
------------------------------------------------------------------------- */
'
basic
'
:
{
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录