Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
Ablesons
three.js
提交
42c3f3de
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,发现更多精彩内容 >>
提交
42c3f3de
编写于
6月 22, 2015
作者:
W
WestLangley
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
Updated tessellation example
上级
62772a26
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
46 addition
and
61 deletion
+46
-61
examples/webgl_modifier_tessellation.html
examples/webgl_modifier_tessellation.html
+46
-61
未找到文件。
examples/webgl_modifier_tessellation.html
浏览文件 @
42c3f3de
...
@@ -64,7 +64,7 @@
...
@@ -64,7 +64,7 @@
vNormal
=
normal
;
vNormal
=
normal
;
vColor
=
customColor
;
vColor
=
customColor
;
vec3
newPosition
=
position
+
amplitude
*
displacement
;
vec3
newPosition
=
position
+
normal
*
amplitude
*
displacement
;
gl_Position
=
projectionMatrix
*
modelViewMatrix
*
vec4
(
newPosition
,
1.0
);
gl_Position
=
projectionMatrix
*
modelViewMatrix
*
vec4
(
newPosition
,
1.0
);
}
}
...
@@ -78,7 +78,7 @@
...
@@ -78,7 +78,7 @@
void
main
()
{
void
main
()
{
const
float
ambient
=
0.
005
;
const
float
ambient
=
0.
4
;
vec3
light
=
vec3
(
1.0
);
vec3
light
=
vec3
(
1.0
);
light
=
normalize
(
light
);
light
=
normalize
(
light
);
...
@@ -86,7 +86,6 @@
...
@@ -86,7 +86,6 @@
float
directional
=
max
(
dot
(
vNormal
,
light
),
0.0
);
float
directional
=
max
(
dot
(
vNormal
,
light
),
0.0
);
gl_FragColor
=
vec4
(
(
directional
+
ambient
)
*
vColor
,
1.0
);
gl_FragColor
=
vec4
(
(
directional
+
ambient
)
*
vColor
,
1.0
);
gl_FragColor
.
xyz
=
sqrt
(
gl_FragColor
.
xyz
);
}
}
...
@@ -109,8 +108,8 @@
...
@@ -109,8 +108,8 @@
function
init
()
{
function
init
()
{
camera
=
new
THREE
.
PerspectiveCamera
(
25
,
WIDTH
/
HEIGHT
,
1
,
10000
);
camera
=
new
THREE
.
PerspectiveCamera
(
40
,
WIDTH
/
HEIGHT
,
1
,
10000
);
camera
.
position
.
z
=
350
;
camera
.
position
.
set
(
-
100
,
100
,
200
)
;
controls
=
new
THREE
.
TrackballControls
(
camera
);
controls
=
new
THREE
.
TrackballControls
(
camera
);
...
@@ -118,31 +117,6 @@
...
@@ -118,31 +117,6 @@
//
//
attributes
=
{
displacement
:
{
type
:
'
v3
'
,
value
:
[]
},
customColor
:
{
type
:
'
c
'
,
value
:
[]
}
};
uniforms
=
{
amplitude
:
{
type
:
"
f
"
,
value
:
0.0
}
};
var
shaderMaterial
=
new
THREE
.
ShaderMaterial
(
{
uniforms
:
uniforms
,
attributes
:
attributes
,
vertexShader
:
document
.
getElementById
(
'
vertexshader
'
).
textContent
,
fragmentShader
:
document
.
getElementById
(
'
fragmentshader
'
).
textContent
,
shading
:
THREE
.
FlatShading
,
side
:
THREE
.
DoubleSide
});
var
geometry
=
new
THREE
.
TextGeometry
(
"
THREE.JS
"
,
{
var
geometry
=
new
THREE
.
TextGeometry
(
"
THREE.JS
"
,
{
size
:
40
,
size
:
40
,
...
@@ -159,8 +133,6 @@
...
@@ -159,8 +133,6 @@
});
});
geometry
.
dynamic
=
true
;
geometry
.
center
();
geometry
.
center
();
var
tessellateModifier
=
new
THREE
.
TessellateModifier
(
8
);
var
tessellateModifier
=
new
THREE
.
TessellateModifier
(
8
);
...
@@ -174,57 +146,68 @@
...
@@ -174,57 +146,68 @@
var
explodeModifier
=
new
THREE
.
ExplodeModifier
();
var
explodeModifier
=
new
THREE
.
ExplodeModifier
();
explodeModifier
.
modify
(
geometry
);
explodeModifier
.
modify
(
geometry
);
var
vertices
=
geometry
.
vertices
;
var
numFaces
=
geometry
.
faces
.
length
;
//
geometry
=
new
THREE
.
BufferGeometry
().
fromGeometry
(
geometry
);
var
colors
=
attributes
.
customColor
.
value
;
var
colors
=
new
Float32Array
(
numFaces
*
3
*
3
)
;
var
displacement
=
attributes
.
displacement
.
value
;
var
displacement
=
new
Float32Array
(
numFaces
*
3
*
3
)
;
var
nv
,
v
=
0
;
var
color
=
new
THREE
.
Color
()
;
for
(
var
f
=
0
;
f
<
geometry
.
faces
.
length
;
f
++
)
{
for
(
var
f
=
0
;
f
<
numFaces
;
f
++
)
{
var
face
=
geometry
.
faces
[
f
]
;
var
index
=
9
*
f
;
if
(
face
instanceof
THREE
.
Face3
)
{
var
h
=
0.2
*
Math
.
random
();
var
s
=
0.5
+
0.5
*
Math
.
random
();
var
l
=
0.5
+
0.5
*
Math
.
random
();
color
.
setHSL
(
h
,
s
,
l
);
nv
=
3
;
var
d
=
10
*
(
0.5
-
Math
.
random
()
);
for
(
var
i
=
0
;
i
<
3
;
i
++
)
{
}
else
{
colors
[
index
+
(
3
*
i
)
]
=
color
.
r
;
colors
[
index
+
(
3
*
i
)
+
1
]
=
color
.
g
;
colors
[
index
+
(
3
*
i
)
+
2
]
=
color
.
b
;
nv
=
4
;
displacement
[
index
+
(
3
*
i
)
]
=
d
;
displacement
[
index
+
(
3
*
i
)
+
1
]
=
d
;
displacement
[
index
+
(
3
*
i
)
+
2
]
=
d
;
}
}
var
h
=
0.15
*
Math
.
random
();
}
var
s
=
0.5
+
0.5
*
Math
.
random
();
var
l
=
0.5
+
0.5
*
Math
.
random
();
var
d
=
10
*
(
0.5
-
Math
.
random
()
);
geometry
.
addAttribute
(
'
customColor
'
,
new
THREE
.
BufferAttribute
(
colors
,
3
)
);
geometry
.
addAttribute
(
'
displacement
'
,
new
THREE
.
BufferAttribute
(
displacement
,
3
)
);
var
x
=
2
*
(
0.5
-
Math
.
random
()
);
//
var
y
=
2
*
(
0.5
-
Math
.
random
()
);
var
z
=
2
*
(
0.5
-
Math
.
random
()
);
for
(
var
i
=
0
;
i
<
nv
;
i
++
)
{
attributes
=
[
`displacement`
,
`customColor`
];
colors
[
v
]
=
new
THREE
.
Color
();
uniforms
=
{
displacement
[
v
]
=
new
THREE
.
Vector3
();
colors
[
v
].
setHSL
(
h
,
s
,
l
);
amplitude
:
{
type
:
"
f
"
,
value
:
0.0
}
colors
[
v
].
convertGammaToLinear
();
displacement
[
v
].
set
(
x
,
y
,
z
)
;
}
;
v
+=
1
;
var
shaderMaterial
=
new
THREE
.
ShaderMaterial
(
{
}
uniforms
:
uniforms
,
attributes
:
attributes
,
vertexShader
:
document
.
getElementById
(
'
vertexshader
'
).
textContent
,
fragmentShader
:
document
.
getElementById
(
'
fragmentshader
'
).
textContent
}
}
);
console
.
log
(
"
faces
"
,
geometry
.
faces
.
length
);
//
mesh
=
new
THREE
.
Mesh
(
geometry
,
shaderMaterial
);
mesh
=
new
THREE
.
Mesh
(
geometry
,
shaderMaterial
);
mesh
.
rotation
.
set
(
0.5
,
0.5
,
0
);
scene
.
add
(
mesh
);
scene
.
add
(
mesh
);
...
@@ -259,6 +242,7 @@
...
@@ -259,6 +242,7 @@
requestAnimationFrame
(
animate
);
requestAnimationFrame
(
animate
);
render
();
render
();
stats
.
update
();
stats
.
update
();
}
}
...
@@ -267,9 +251,10 @@
...
@@ -267,9 +251,10 @@
var
time
=
Date
.
now
()
*
0.001
;
var
time
=
Date
.
now
()
*
0.001
;
uniforms
.
amplitude
.
value
=
Math
.
sin
(
time
*
0.5
);
uniforms
.
amplitude
.
value
=
1.0
+
Math
.
sin
(
time
*
0.5
);
controls
.
update
();
controls
.
update
();
renderer
.
render
(
scene
,
camera
);
renderer
.
render
(
scene
,
camera
);
}
}
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录