Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
车家大少爷
three.js
提交
288cf2fb
T
three.js
项目概览
车家大少爷
/
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,发现更多精彩内容 >>
提交
288cf2fb
编写于
4月 13, 2018
作者:
M
meatbags
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
add pass params
上级
a7c59032
变更
3
隐藏空白更改
内联
并排
Showing
3 changed file
with
41 addition
and
14 deletion
+41
-14
examples/js/postprocessing/HalftonePass.js
examples/js/postprocessing/HalftonePass.js
+22
-9
examples/js/shaders/HalftoneShader.js
examples/js/shaders/HalftoneShader.js
+5
-3
examples/webgl_postprocessing_rgb_halftone.html
examples/webgl_postprocessing_rgb_halftone.html
+14
-2
未找到文件。
examples/js/postprocessing/HalftonePass.js
浏览文件 @
288cf2fb
...
...
@@ -5,11 +5,9 @@
*
*/
THREE
.
HalftonePass
=
function
(
width
,
height
)
{
THREE
.
HalftonePass
=
function
(
width
,
height
,
params
)
{
THREE
.
Pass
.
call
(
this
);
this
.
width
=
width
;
this
.
height
=
height
;
if
(
THREE
.
HalftoneShader
===
undefined
)
{
...
...
@@ -24,6 +22,20 @@ THREE.HalftonePass = function ( width, height ) {
vertexShader
:
THREE
.
HalftoneShader
.
vertexShader
}
);
// set params
this
.
uniforms
.
width
.
value
=
width
;
this
.
uniforms
.
height
.
value
=
height
;
for
(
var
key
in
params
)
{
if
(
params
.
hasOwnProperty
(
key
)
&&
this
.
uniforms
.
hasOwnProperty
(
key
)
)
{
this
.
uniforms
[
key
].
value
=
params
[
key
];
}
}
this
.
camera
=
new
THREE
.
OrthographicCamera
(
-
1
,
1
,
1
,
-
1
,
0
,
1
);
this
.
scene
=
new
THREE
.
Scene
();
this
.
quad
=
new
THREE
.
Mesh
(
new
THREE
.
PlaneBufferGeometry
(
2
,
2
),
null
);
...
...
@@ -33,8 +45,10 @@ THREE.HalftonePass = function ( width, height ) {
};
THREE
.
HalftonePass
.
prototype
=
Object
.
assign
(
Object
.
create
(
THREE
.
Pass
.
prototype
),
{
constructor
:
THREE
.
HalftonePass
,
render
:
function
(
renderer
,
writeBuffer
,
readBuffer
,
delta
,
maskActive
)
{
constructor
:
THREE
.
HalftonePass
,
render
:
function
(
renderer
,
writeBuffer
,
readBuffer
,
delta
,
maskActive
)
{
this
.
material
.
uniforms
[
"
tDiffuse
"
].
value
=
readBuffer
.
texture
;
this
.
quad
.
material
=
this
.
material
;
...
...
@@ -50,12 +64,11 @@ THREE.HalftonePass = function ( width, height ) {
}
},
setSize
:
function
(
width
,
height
)
{
this
.
width
=
width
;
this
.
height
=
height
;
this
.
uniforms
[
'
width
'
].
value
=
this
.
width
;
this
.
uniforms
[
'
height
'
].
value
=
this
.
height
;
this
.
uniforms
.
width
.
value
=
width
;
this
.
uniforms
.
height
.
value
=
height
;
}
}
);
examples/js/shaders/HalftoneShader.js
浏览文件 @
288cf2fb
...
...
@@ -2,7 +2,9 @@
* @author meatbags / xavierburrow.com, github/meatbags
*
* RGB Halftone shader for three.js.
*
* NOTE:
* Shape (1 = Dot, 2 = Ellipse, 3 = Line, 4 = Square)
* Blending Mode (1 = Linear, 2 = Multiply, 3 = Add, 4 = Lighter, 5 = Darker)
*/
THREE
.
HalftoneShader
=
{
...
...
@@ -40,12 +42,12 @@ THREE.HalftoneShader = {
"
#define SQRT2_MINUS_ONE 0.41421356
"
,
"
#define SQRT2_HALF_MINUS_ONE 0.20710678
"
,
"
#define SHAPE_DOT 1
"
,
"
#define PI2 6.28318531
"
,
"
#define SHAPE_DOT 1
"
,
"
#define SHAPE_ELLIPSE 2
"
,
"
#define SHAPE_LINE 3
"
,
"
#define SHAPE_SQUARE 4
"
,
"
#define BLENDING_LINEAR 1
"
,
"
#define SHAPE_LINE 3
"
,
"
#define BLENDING_MULTIPLY 2
"
,
"
#define BLENDING_ADD 3
"
,
"
#define BLENDING_LIGHTER 4
"
,
...
...
examples/webgl_postprocessing_rgb_halftone.html
浏览文件 @
288cf2fb
...
...
@@ -134,11 +134,23 @@
}
// post-processing
var
composer
,
renderPass
,
halftonePass
;
var
composer
,
renderPass
,
halftonePass
,
params
;
composer
=
new
THREE
.
EffectComposer
(
renderer
);
renderPass
=
new
THREE
.
RenderPass
(
scene
,
camera
);
halftonePass
=
new
THREE
.
HalftonePass
(
window
.
innerWidth
,
window
.
innerHeight
);
params
=
{
shape
:
1
,
radius
:
4
,
rotateR
:
Math
.
PI
/
12
,
rotateB
:
Math
.
PI
/
12
*
2
,
rotateG
:
Math
.
PI
/
12
*
3
,
scatter
:
0
,
blending
:
1
,
blendingMode
:
1
,
greyscale
:
false
,
disable
:
false
};
halftonePass
=
new
THREE
.
HalftonePass
(
window
.
innerWidth
,
window
.
innerHeight
,
params
);
halftonePass
.
renderToScreen
=
true
;
composer
.
addPass
(
renderPass
);
composer
.
addPass
(
halftonePass
);
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录