Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
Ablesons
three.js
提交
1c92e927
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,发现更多精彩内容 >>
提交
1c92e927
编写于
2月 12, 2016
作者:
B
Ben Houston
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
debugging minor issues.
上级
4f2f70ec
变更
4
隐藏空白更改
内联
并排
Showing
4 changed file
with
105 addition
and
96 deletion
+105
-96
examples/js/postprocessing/EffectComposer.js
examples/js/postprocessing/EffectComposer.js
+1
-1
examples/js/postprocessing/MSAAPass.js
examples/js/postprocessing/MSAAPass.js
+44
-90
examples/js/shaders/CompositeShader.js
examples/js/shaders/CompositeShader.js
+55
-0
examples/webgl_postprocessing_msaa.html
examples/webgl_postprocessing_msaa.html
+5
-5
未找到文件。
examples/js/postprocessing/EffectComposer.js
浏览文件 @
1c92e927
...
...
@@ -12,7 +12,7 @@ THREE.EffectComposer = function ( renderer, renderTarget ) {
var
width
=
Math
.
floor
(
renderer
.
context
.
canvas
.
width
/
pixelRatio
)
||
1
;
var
height
=
Math
.
floor
(
renderer
.
context
.
canvas
.
height
/
pixelRatio
)
||
1
;
var
parameters
=
{
minFilter
:
THREE
.
LinearFilter
,
magFilter
:
THREE
.
LinearFilter
,
format
:
THREE
.
RGBFormat
,
stencilBuffer
:
false
};
var
parameters
=
{
minFilter
:
THREE
.
LinearFilter
,
magFilter
:
THREE
.
LinearFilter
,
format
:
THREE
.
RGB
A
Format
,
stencilBuffer
:
false
};
renderTarget
=
new
THREE
.
WebGLRenderTarget
(
width
,
height
,
parameters
);
...
...
examples/js/postprocessing/MSAAPass.js
浏览文件 @
1c92e927
...
...
@@ -7,7 +7,7 @@ THREE.MSAAPass = function ( scene, camera, params, clearColor, clearAlpha ) {
this
.
scene
=
scene
;
this
.
camera
=
camera
;
this
.
currentS
ampleLevel
=
4
;
this
.
s
ampleLevel
=
4
;
this
.
params
=
params
||
{
minFilter
:
THREE
.
NearestFilter
,
magFilter
:
THREE
.
NearestFilter
,
format
:
THREE
.
RGBAFormat
};
this
.
params
.
minFilter
=
THREE
.
NearestFilter
;
...
...
@@ -23,14 +23,18 @@ THREE.MSAAPass = function ( scene, camera, params, clearColor, clearAlpha ) {
this
.
clear
=
false
;
this
.
needsSwap
=
true
;
var
msaaShader
=
THREE
.
MSAA4Shader
;
this
.
uniforms
=
THREE
.
UniformsUtils
.
clone
(
msaaShader
.
uniforms
);
if
(
THREE
.
CompositeShader
===
undefined
)
{
console
.
error
(
"
THREE.MSAAPass relies on THREE.CompositeShader
"
);
}
this
.
materialMSAA
=
new
THREE
.
ShaderMaterial
({
shaderID
:
msaaShader
.
shaderID
,
uniforms
:
this
.
uniforms
,
vertexShader
:
msaaShader
.
vertexShader
,
fragmentShader
:
msaaShader
.
fragmentShader
,
var
compositeShader
=
THREE
.
CompositeShader
;
this
.
uniforms
=
THREE
.
UniformsUtils
.
clone
(
compositeShader
.
uniforms
);
this
.
materialComposite
=
new
THREE
.
ShaderMaterial
(
{
uniforms
:
this
.
uniforms
,
vertexShader
:
compositeShader
.
vertexShader
,
fragmentShader
:
compositeShader
.
fragmentShader
,
transparent
:
true
,
blending
:
THREE
.
CustomBlending
,
blendSrc
:
THREE
.
OneFactor
,
...
...
@@ -38,133 +42,83 @@ THREE.MSAAPass = function ( scene, camera, params, clearColor, clearAlpha ) {
blendEquation
:
THREE
.
AddEquation
,
depthTest
:
false
,
depthWrite
:
false
});
}
);
this
.
camera2
=
new
THREE
.
OrthographicCamera
(
-
1
,
1
,
1
,
-
1
,
0
,
1
);
this
.
scene2
=
new
THREE
.
Scene
();
this
.
quad2
=
new
THREE
.
Mesh
(
new
THREE
.
PlaneGeometry
(
2
,
2
),
null
);
this
.
quad2
=
new
THREE
.
Mesh
(
new
THREE
.
PlaneGeometry
(
2
,
2
),
this
.
materialComposite
);
this
.
scene2
.
add
(
this
.
quad2
);
this
.
devicePixelRatio
=
1
;
};
THREE
.
MSAAPass
.
prototype
=
{
dispose
:
function
()
{
if
(
this
.
renderTargets
)
{
for
(
var
i
=
0
;
i
<
this
.
renderTargets
.
length
;
i
++
)
{
this
.
renderTargets
[
i
].
dispose
();
}
this
.
renderTargets
=
null
;
}
},
if
(
this
.
sampleRenderTarget
)
{
render
:
function
(
renderer
,
writeBuffer
,
readBuffer
,
delta
)
{
this
.
sampleRenderTarget
.
dispose
();
this
.
sampleRenderTarget
=
null
;
if
(
!
this
.
renderTargets
)
{
this
.
renderTargets
=
[];
for
(
var
i
=
0
;
i
<
2
;
i
++
)
{
this
.
renderTargets
.
push
(
new
THREE
.
WebGLRenderTarget
(
readBuffer
.
width
,
readBuffer
.
height
,
this
.
params
,
"
msaa.renderTarget
"
+
i
)
);
}
}
var
camera
=
(
this
.
camera
||
this
.
scene
.
camera
);
var
currentSampleOffsets
=
THREE
.
MSAAPass
.
JitterVectors
[
Math
.
max
(
0
,
Math
.
min
(
this
.
currentSampleLevel
,
5
)
)
];
if
(
!
currentSampleOffsets
)
{
},
renderer
.
render
(
this
.
scene
,
camera
,
this
.
renderTargets
[
0
],
true
);
render
:
function
(
renderer
,
writeBuffer
,
readBuffer
,
delta
)
{
this
.
uniforms
[
"
tBackground
"
].
value
=
readBuffer
;
this
.
uniforms
[
"
scale
"
].
value
=
1.0
;
for
(
var
k
=
0
;
k
<
this
.
renderTargets
.
length
;
k
++
)
{
this
.
uniforms
[
"
tSample
"
+
k
].
value
=
this
.
renderTargets
[
0
];
}
this
.
quad2
.
material
=
this
.
materialMSAA
;
if
(
!
this
.
sampleRenderTarget
)
{
renderer
.
render
(
this
.
scene2
,
this
.
camera2
,
writeBuffer
,
true
);
this
.
sampleRenderTarget
=
new
THREE
.
WebGLRenderTarget
(
readBuffer
.
width
,
readBuffer
.
height
,
this
.
params
,
"
msaa.renderTarget0
"
);
return
;
}
this
.
scene
.
overrideMaterial
=
null
;
this
.
oldClearColor
.
copy
(
renderer
.
getClearColor
()
);
this
.
oldClearAlpha
=
renderer
.
getClearAlpha
();
renderer
.
setClearColor
(
new
THREE
.
Color
(
0
,
0
,
0
),
0
);
for
(
var
j
=
0
;
j
<
currentSampleOffsets
.
length
;
j
+=
this
.
renderTargets
.
length
)
{
this
.
uniforms
[
"
tBackground
"
].
value
=
readBuffer
;
this
.
uniforms
[
"
scale
"
].
value
=
1.0
/
currentSampleOffsets
.
length
;
for
(
var
k
=
0
;
k
<
this
.
renderTargets
.
length
;
k
++
)
{
this
.
uniforms
[
"
tSample
"
+
k
].
value
=
this
.
renderTargets
[
k
];
}
this
.
quad2
.
material
=
this
.
materialMSAA
;
for
(
var
k
=
0
;
k
<
Math
.
min
(
currentSampleOffsets
.
length
-
j
,
this
.
renderTargets
.
length
);
k
++
)
{
var
i
=
j
+
k
;
var
camera
=
(
this
.
camera
||
this
.
scene
.
camera
);
if
(
camera
.
setViewOffset
)
{
var
jitterOffsets
=
THREE
.
MSAAPass
.
JitterVectors
[
Math
.
max
(
0
,
Math
.
min
(
this
.
sampleLevel
,
5
)
)
];
camera
.
setViewOffset
(
readBuffer
.
width
,
readBuffer
.
height
,
currentSampleOffsets
[
i
].
x
,
currentSampleOffsets
[
i
].
y
,
readBuffer
.
width
,
readBuffer
.
height
);
this
.
uniforms
[
"
tForeground
"
].
value
=
this
.
sampleRenderTarget
;
this
.
uniforms
[
"
scale
"
].
value
=
1.0
/
jitterOffsets
.
length
;
}
for
(
var
i
=
0
;
i
<
jitterOffsets
.
length
;
i
++
)
{
renderer
.
render
(
this
.
scene
,
camera
,
this
.
renderTargets
[
k
],
true
);
if
(
camera
.
setViewOffset
)
camera
.
setViewOffset
(
readBuffer
.
width
,
readBuffer
.
height
,
jitterOffsets
[
i
].
x
,
jitterOffsets
[
i
].
y
,
readBuffer
.
width
,
readBuffer
.
height
);
}
renderer
.
render
(
this
.
scene
,
camera
,
this
.
sampleRenderTarget
,
true
);
renderer
.
render
(
this
.
scene2
,
this
.
camera2
,
writeBuffer
,
j
===
0
);
renderer
.
render
(
this
.
scene2
,
this
.
camera2
,
writeBuffer
,
i
===
0
);
}
camera
.
fullWidth
=
undefined
;
camera
.
fullHeight
=
undefined
;
camera
.
x
=
undefined
;
camera
.
y
=
undefined
;
camera
.
width
=
undefined
;
camera
.
height
=
undefined
;
camera
.
updateProjectionMatrix
();
renderer
.
setClearColor
(
this
.
oldClearColor
,
this
.
oldClearAlpha
);
if
(
camera
.
setViewOffset
)
camera
.
setViewOffset
(
undefined
,
undefined
,
undefined
,
undefined
,
undefined
,
undefined
);
}
};
THREE
.
MSAAPass
.
normalizedJitterVectors
=
function
()
{
var
xfrm
=
new
THREE
.
Matrix4
().
makeScale
(
1
/
16.0
,
1
/
16.0
,
0
);
};
return
function
(
jitterVectors
)
{
var
vectors2
=
[];
for
(
var
i
=
0
;
i
<
jitterVectors
.
length
;
i
++
)
{
vectors2
.
push
(
new
THREE
.
Vector3
(
jitterVectors
[
i
][
0
],
jitterVectors
[
i
][
0
]
).
applyMatrix4
(
xfrm
)
);
}
return
vectors2
;
THREE
.
MSAAPass
.
normalizedJitterOffsets
=
function
(
jitterVectors
)
{
var
vectors2
=
[];
for
(
var
i
=
0
;
i
<
jitterVectors
.
length
;
i
++
)
{
vectors2
.
push
(
new
THREE
.
Vector2
(
jitterVectors
[
i
][
0
],
jitterVectors
[
i
][
1
]
).
multiplyScalar
(
1.0
/
16.0
)
);
}
}(),
return
vectors2
;
},
THREE
.
MSAAPass
.
JitterVectors
=
[
THREE
.
MSAAPass
.
normalizedJitter
Vector
s
(
[
THREE
.
MSAAPass
.
normalizedJitter
Offset
s
(
[
[
0
,
0
]
]
),
THREE
.
MSAAPass
.
normalizedJitter
Vector
s
(
[
THREE
.
MSAAPass
.
normalizedJitter
Offset
s
(
[
[
4
,
4
],
[
-
4
,
-
4
]
]
),
THREE
.
MSAAPass
.
normalizedJitter
Vector
s
(
[
THREE
.
MSAAPass
.
normalizedJitter
Offset
s
(
[
[
-
2
,
-
6
],
[
6
,
-
2
],
[
-
6
,
2
],
[
2
,
6
]
]
),
THREE
.
MSAAPass
.
normalizedJitter
Vector
s
(
[
THREE
.
MSAAPass
.
normalizedJitter
Offset
s
(
[
[
1
,
-
3
],
[
-
1
,
3
],
[
5
,
1
],
...
...
@@ -174,7 +128,7 @@ THREE.MSAAPass.JitterVectors = [
[
3
,
7
],
[
7
,
-
7
]
]
),
THREE
.
MSAAPass
.
normalizedJitter
Vector
s
(
[
THREE
.
MSAAPass
.
normalizedJitter
Offset
s
(
[
[
1
,
1
],
[
-
1
,
-
3
],
[
-
3
,
2
],
...
...
@@ -195,7 +149,7 @@ THREE.MSAAPass.JitterVectors = [
[
6
,
7
],
[
-
7
,
-
8
]
]
),
THREE
.
MSAAPass
.
normalizedJitter
Vector
s
(
[
THREE
.
MSAAPass
.
normalizedJitter
Offset
s
(
[
[
-
4
,
-
7
],
[
-
7
,
-
5
],
[
-
3
,
-
5
],
...
...
examples/js/shaders/
MSAA
Shader.js
→
examples/js/shaders/
Composite
Shader.js
浏览文件 @
1c92e927
...
...
@@ -4,18 +4,14 @@
* Multi-Sample Anti-aliasing shader - for blending together sample buffers
*/
THREE
.
MSAA4
Shader
=
{
THREE
.
Composite
Shader
=
{
shaderID
:
"
msaa
"
,
shaderID
:
"
composite
"
,
uniforms
:
{
"
tBackground
"
:
{
type
:
"
t
"
,
value
:
null
},
"
tSample0
"
:
{
type
:
"
t
"
,
value
:
null
},
"
tSample1
"
:
{
type
:
"
t
"
,
value
:
null
},
//"tSample2": { type: "t", value: null },
//"tSample3": { type: "t", value: null },
"
nSamples
"
:
{
type
:
"
i
"
,
value
:
4
},
// "tBackground": { type: "t", value: null },
"
tForeground
"
:
{
type
:
"
t
"
,
value
:
null
},
"
scale
"
:
{
type
:
"
f
"
,
value
:
1.0
}
},
...
...
@@ -37,12 +33,8 @@ THREE.MSAA4Shader = {
"
varying vec2 vUv;
"
,
"
uniform sampler2D tBackground;
"
,
"
uniform sampler2D tSample0;
"
,
"
uniform sampler2D tSample1;
"
,
"
uniform int nSamples;
"
,
// "uniform sampler2D tBackground;",
"
uniform sampler2D tForeground;
"
,
"
uniform float scale;
"
,
"
vec4 composite( vec4 foreground, vec4 background ) {
"
,
...
...
@@ -51,14 +43,10 @@ THREE.MSAA4Shader = {
"
void main() {
"
,
"
vec4 background = texture2D( tBackground, vUv );
"
,
"
vec4 foreground = composite( texture2D( tSample0, vUv ), background );
"
,
"
if( scale < 0.9 ) {
"
,
"
foreground += composite( texture2D( tSample1, vUv ), background );
"
,
"
}
"
,
// "vec4 background = texture2D( tBackground, vUv );",
"
vec4 foreground = texture2D( tForeground, vUv );
"
,
"
gl_FragColor =
vec4( foreground.rgb * scale, foreground.a * scale )
;
"
,
"
gl_FragColor =
foreground * scale;//composite( foreground, background ) * scale
;
"
,
"
}
"
...
...
examples/webgl_postprocessing_msaa.html
浏览文件 @
1c92e927
...
...
@@ -21,7 +21,7 @@
<script
src=
"js/postprocessing/MSAAPass.js"
></script>
<script
src=
"js/shaders/CopyShader.js"
></script>
<script
src=
"js/shaders/
MSAA
Shader.js"
></script>
<script
src=
"js/shaders/
Composite
Shader.js"
></script>
<script
src=
"js/postprocessing/EffectComposer.js"
></script>
<script
src=
"js/postprocessing/RenderPass.js"
></script>
...
...
@@ -55,7 +55,7 @@
geometry
=
new
THREE
.
BoxGeometry
(
200
,
200
,
200
);
material
=
new
THREE
.
MeshBasicMaterial
(
{
map
:
meshTexture
}
);
meshTexture
.
anisotropy
=
4
;
meshTexture
.
anisotropy
=
0
;
object
=
new
THREE
.
Mesh
(
geometry
,
material
);
...
...
@@ -65,11 +65,11 @@
composer
=
new
THREE
.
EffectComposer
(
renderer
);
var
massPass
=
new
THREE
.
MSAAPass
(
scene
,
camera
,
new
THREE
.
Color
(
1.0
,
1.0
,
1.0
),
1
.0
);
massPass
.
currentSampleLevel
=
4
;
var
massPass
=
new
THREE
.
MSAAPass
(
scene
,
camera
,
new
THREE
.
Color
(
0.0
,
0.0
,
0.0
),
0
.0
);
massPass
.
sampleLevel
=
2
;
composer
.
addPass
(
massPass
);
var
copyPass
=
new
THREE
.
ShaderPass
(
THREE
.
CopyShader
);
var
copyPass
=
new
THREE
.
ShaderPass
(
THREE
.
CopyShader
);
copyPass
.
renderToScreen
=
true
;
composer
.
addPass
(
copyPass
);
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录