Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
Ablesons
three.js
提交
845609ee
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,发现更多精彩内容 >>
提交
845609ee
编写于
8月 22, 2017
作者:
M
Mr.doob
提交者:
GitHub
8月 22, 2017
浏览文件
操作
浏览文件
下载
差异文件
Merge pull request #12016 from Mugen87/dev4
Examples: Simplify some buffer geometry examples
上级
4c739b15
74935383
变更
7
隐藏空白更改
内联
并排
Showing
7 changed file
with
158 addition
and
205 deletion
+158
-205
examples/webgl_buffergeometry.html
examples/webgl_buffergeometry.html
+18
-42
examples/webgl_buffergeometry_custom_attributes_particles.html
...les/webgl_buffergeometry_custom_attributes_particles.html
+14
-19
examples/webgl_buffergeometry_lines.html
examples/webgl_buffergeometry_lines.html
+11
-12
examples/webgl_buffergeometry_lines_indexed.html
examples/webgl_buffergeometry_lines_indexed.html
+67
-54
examples/webgl_buffergeometry_points.html
examples/webgl_buffergeometry_points.html
+7
-11
examples/webgl_buffergeometry_rawshader.html
examples/webgl_buffergeometry_rawshader.html
+16
-17
examples/webgl_buffergeometry_uint.html
examples/webgl_buffergeometry_uint.html
+25
-50
未找到文件。
examples/webgl_buffergeometry.html
浏览文件 @
845609ee
...
...
@@ -82,14 +82,14 @@
var
geometry
=
new
THREE
.
BufferGeometry
();
var
positions
=
new
Float32Array
(
triangles
*
3
*
3
)
;
var
normals
=
new
Float32Array
(
triangles
*
3
*
3
)
;
var
colors
=
new
Float32Array
(
triangles
*
3
*
3
)
;
var
positions
=
[]
;
var
normals
=
[]
;
var
colors
=
[]
;
var
color
=
new
THREE
.
Color
();
var
n
=
800
,
n2
=
n
/
2
;
// triangles spread in the cube
var
d
=
12
,
d2
=
d
/
2
;
// individual triangle size
var
n
=
800
,
n2
=
n
/
2
;
// triangles spread in the cube
var
d
=
12
,
d2
=
d
/
2
;
// individual triangle size
var
pA
=
new
THREE
.
Vector3
();
var
pB
=
new
THREE
.
Vector3
();
...
...
@@ -98,7 +98,7 @@
var
cb
=
new
THREE
.
Vector3
();
var
ab
=
new
THREE
.
Vector3
();
for
(
var
i
=
0
;
i
<
positions
.
length
;
i
+=
9
)
{
for
(
var
i
=
0
;
i
<
triangles
;
i
++
)
{
// positions
...
...
@@ -118,17 +118,9 @@
var
cy
=
y
+
Math
.
random
()
*
d
-
d2
;
var
cz
=
z
+
Math
.
random
()
*
d
-
d2
;
positions
[
i
]
=
ax
;
positions
[
i
+
1
]
=
ay
;
positions
[
i
+
2
]
=
az
;
positions
[
i
+
3
]
=
bx
;
positions
[
i
+
4
]
=
by
;
positions
[
i
+
5
]
=
bz
;
positions
[
i
+
6
]
=
cx
;
positions
[
i
+
7
]
=
cy
;
positions
[
i
+
8
]
=
cz
;
positions
.
push
(
ax
,
ay
,
az
);
positions
.
push
(
bx
,
by
,
bz
);
positions
.
push
(
cx
,
cy
,
cz
);
// flat face normals
...
...
@@ -146,17 +138,9 @@
var
ny
=
cb
.
y
;
var
nz
=
cb
.
z
;
normals
[
i
]
=
nx
;
normals
[
i
+
1
]
=
ny
;
normals
[
i
+
2
]
=
nz
;
normals
[
i
+
3
]
=
nx
;
normals
[
i
+
4
]
=
ny
;
normals
[
i
+
5
]
=
nz
;
normals
[
i
+
6
]
=
nx
;
normals
[
i
+
7
]
=
ny
;
normals
[
i
+
8
]
=
nz
;
normals
.
push
(
nx
,
ny
,
nz
);
normals
.
push
(
nx
,
ny
,
nz
);
normals
.
push
(
nx
,
ny
,
nz
);
// colors
...
...
@@ -166,25 +150,17 @@
color
.
setRGB
(
vx
,
vy
,
vz
);
colors
[
i
]
=
color
.
r
;
colors
[
i
+
1
]
=
color
.
g
;
colors
[
i
+
2
]
=
color
.
b
;
colors
[
i
+
3
]
=
color
.
r
;
colors
[
i
+
4
]
=
color
.
g
;
colors
[
i
+
5
]
=
color
.
b
;
colors
[
i
+
6
]
=
color
.
r
;
colors
[
i
+
7
]
=
color
.
g
;
colors
[
i
+
8
]
=
color
.
b
;
colors
.
push
(
color
.
r
,
color
.
g
,
color
.
b
);
colors
.
push
(
color
.
r
,
color
.
g
,
color
.
b
);
colors
.
push
(
color
.
r
,
color
.
g
,
color
.
b
);
}
function
disposeArray
()
{
this
.
array
=
null
;
}
geometry
.
addAttribute
(
'
position
'
,
new
THREE
.
BufferAttribute
(
positions
,
3
).
onUpload
(
disposeArray
)
);
geometry
.
addAttribute
(
'
normal
'
,
new
THREE
.
BufferAttribute
(
normals
,
3
).
onUpload
(
disposeArray
)
);
geometry
.
addAttribute
(
'
color
'
,
new
THREE
.
BufferAttribute
(
colors
,
3
).
onUpload
(
disposeArray
)
);
geometry
.
addAttribute
(
'
position
'
,
new
THREE
.
Float32
BufferAttribute
(
positions
,
3
).
onUpload
(
disposeArray
)
);
geometry
.
addAttribute
(
'
normal
'
,
new
THREE
.
Float32
BufferAttribute
(
normals
,
3
).
onUpload
(
disposeArray
)
);
geometry
.
addAttribute
(
'
color
'
,
new
THREE
.
Float32
BufferAttribute
(
colors
,
3
).
onUpload
(
disposeArray
)
);
geometry
.
computeBoundingSphere
();
...
...
examples/webgl_buffergeometry_custom_attributes_particles.html
浏览文件 @
845609ee
...
...
@@ -85,15 +85,12 @@
var
particles
=
100000
;
var
WIDTH
=
window
.
innerWidth
;
var
HEIGHT
=
window
.
innerHeight
;
init
();
animate
();
function
init
()
{
camera
=
new
THREE
.
PerspectiveCamera
(
40
,
WIDTH
/
HEIGHT
,
1
,
10000
);
camera
=
new
THREE
.
PerspectiveCamera
(
40
,
window
.
innerWidth
/
window
.
innerHeight
,
1
,
10000
);
camera
.
position
.
z
=
300
;
scene
=
new
THREE
.
Scene
();
...
...
@@ -122,31 +119,29 @@
geometry
=
new
THREE
.
BufferGeometry
();
var
positions
=
new
Float32Array
(
particles
*
3
)
;
var
colors
=
new
Float32Array
(
particles
*
3
)
;
var
sizes
=
new
Float32Array
(
particles
)
;
var
positions
=
[]
;
var
colors
=
[]
;
var
sizes
=
[]
;
var
color
=
new
THREE
.
Color
();
for
(
var
i
=
0
,
i3
=
0
;
i
<
particles
;
i
++
,
i3
+=
3
)
{
for
(
var
i
=
0
;
i
<
particles
;
i
++
)
{
positions
[
i3
+
0
]
=
(
Math
.
random
()
*
2
-
1
)
*
radius
;
positions
[
i3
+
1
]
=
(
Math
.
random
()
*
2
-
1
)
*
radius
;
positions
[
i3
+
2
]
=
(
Math
.
random
()
*
2
-
1
)
*
radius
;
positions
.
push
(
(
Math
.
random
()
*
2
-
1
)
*
radius
)
;
positions
.
push
(
(
Math
.
random
()
*
2
-
1
)
*
radius
)
;
positions
.
push
(
(
Math
.
random
()
*
2
-
1
)
*
radius
)
;
color
.
setHSL
(
i
/
particles
,
1.0
,
0.5
);
colors
[
i3
+
0
]
=
color
.
r
;
colors
[
i3
+
1
]
=
color
.
g
;
colors
[
i3
+
2
]
=
color
.
b
;
colors
.
push
(
color
.
r
,
color
.
g
,
color
.
b
);
sizes
[
i
]
=
20
;
sizes
.
push
(
20
);
;
}
geometry
.
addAttribute
(
'
position
'
,
new
THREE
.
BufferAttribute
(
positions
,
3
)
);
geometry
.
addAttribute
(
'
customColor
'
,
new
THREE
.
BufferAttribute
(
colors
,
3
)
);
geometry
.
addAttribute
(
'
size
'
,
new
THREE
.
BufferAttribute
(
sizes
,
1
)
);
geometry
.
addAttribute
(
'
position
'
,
new
THREE
.
Float32
BufferAttribute
(
positions
,
3
)
);
geometry
.
addAttribute
(
'
customColor
'
,
new
THREE
.
Float32
BufferAttribute
(
colors
,
3
)
);
geometry
.
addAttribute
(
'
size
'
,
new
THREE
.
Float32
BufferAttribute
(
sizes
,
1
)
);
particleSystem
=
new
THREE
.
Points
(
geometry
,
shaderMaterial
);
...
...
@@ -154,7 +149,7 @@
renderer
=
new
THREE
.
WebGLRenderer
();
renderer
.
setPixelRatio
(
window
.
devicePixelRatio
);
renderer
.
setSize
(
WIDTH
,
HEIGHT
);
renderer
.
setSize
(
window
.
innerWidth
,
window
.
innerHeight
);
var
container
=
document
.
getElementById
(
'
container
'
);
container
.
appendChild
(
renderer
.
domElement
);
...
...
examples/webgl_buffergeometry_lines.html
浏览文件 @
845609ee
...
...
@@ -62,14 +62,13 @@
scene
=
new
THREE
.
Scene
();
var
segments
=
10000
;
var
geometry
=
new
THREE
.
BufferGeometry
();
var
material
=
new
THREE
.
LineBasicMaterial
(
{
vertexColors
:
THREE
.
VertexColors
}
);
var
material
=
new
THREE
.
LineBasicMaterial
(
{
vertexColors
:
THREE
.
VertexColors
}
);
var
positions
=
new
Float32Array
(
segments
*
3
)
;
var
colors
=
new
Float32Array
(
segments
*
3
)
;
var
positions
=
[]
;
var
colors
=
[]
;
var
r
=
800
;
...
...
@@ -81,20 +80,20 @@
// positions
positions
[
i
*
3
]
=
x
;
positions
[
i
*
3
+
1
]
=
y
;
positions
[
i
*
3
+
2
]
=
z
;
positions
.
push
(
x
,
y
,
z
);
// colors
colors
[
i
*
3
]
=
(
x
/
r
)
+
0.5
;
colors
[
i
*
3
+
1
]
=
(
y
/
r
)
+
0.5
;
colors
[
i
*
3
+
2
]
=
(
z
/
r
)
+
0.5
;
colors
.
push
(
(
x
/
r
)
+
0.5
);
colors
.
push
(
(
y
/
r
)
+
0.5
);
colors
.
push
(
(
z
/
r
)
+
0.5
);
}
geometry
.
addAttribute
(
'
position
'
,
new
THREE
.
BufferAttribute
(
positions
,
3
)
);
geometry
.
addAttribute
(
'
color
'
,
new
THREE
.
BufferAttribute
(
colors
,
3
)
);
geometry
.
addAttribute
(
'
position
'
,
new
THREE
.
Float32
BufferAttribute
(
positions
,
3
)
);
geometry
.
addAttribute
(
'
color
'
,
new
THREE
.
Float32
BufferAttribute
(
colors
,
3
)
);
geometry
.
computeBoundingSphere
();
...
...
examples/webgl_buffergeometry_lines_indexed.html
浏览文件 @
845609ee
...
...
@@ -61,81 +61,95 @@
scene
=
new
THREE
.
Scene
();
var
geometry
=
new
THREE
.
BufferGeometry
();
var
material
=
new
THREE
.
LineBasicMaterial
(
{
vertexColors
:
THREE
.
VertexColors
}
);
var
material
=
new
THREE
.
LineBasicMaterial
(
{
vertexColors
:
THREE
.
VertexColors
}
);
var
indices
=
[];
var
positions
=
[];
var
next_positions_index
=
0
;
var
colors
=
[];
var
indices_array
=
[];
var
next_positions_index
=
0
;
//
var
iteration_count
=
4
;
var
rangle
=
60
*
Math
.
PI
/
180.0
;
function
add_vertex
(
v
)
{
function
add_vertex
(
v
)
{
if
(
next_positions_index
==
0xffff
)
console
.
error
(
'
Too many points.
'
);
positions
.
push
(
v
.
x
,
v
.
y
,
v
.
z
);
colors
.
push
(
Math
.
random
()
*
0.5
+
0.5
,
Math
.
random
()
*
0.5
+
0.5
,
1
);
if
(
next_positions_index
==
0xffff
)
throw
new
Error
(
"
Too many points
"
)
;
return
next_positions_index
++
;
positions
.
push
(
v
.
x
,
v
.
y
,
v
.
z
);
colors
.
push
(
Math
.
random
()
*
0.5
+
0.5
,
Math
.
random
()
*
0.5
+
0.5
,
1
);
return
next_positions_index
++
;
}
// simple Koch curve
function
snowflake_iteration
(
p0
,
p4
,
depth
)
{
function
snowflake_iteration
(
p0
,
p4
,
depth
)
{
if
(
--
depth
<
0
)
{
if
(
--
depth
<
0
)
{
var
i
=
next_positions_index
-
1
;
// p0 already there
add_vertex
(
p4
);
indices
.
push
(
i
,
i
+
1
);
var
i
=
next_positions_index
-
1
;
// p0 already there
add_vertex
(
p4
);
indices_array
.
push
(
i
,
i
+
1
);
return
;
}
var
v
=
p4
.
clone
().
sub
(
p0
);
var
v_tier
=
v
.
clone
().
multiplyScalar
(
1.0
/
3.0
);
var
p1
=
p0
.
clone
().
add
(
v_tier
);
var
v
=
p4
.
clone
().
sub
(
p0
);
var
v_tier
=
v
.
clone
().
multiplyScalar
(
1
/
3
);
var
p1
=
p0
.
clone
().
add
(
v_tier
);
var
angle
=
Math
.
atan2
(
v
.
y
,
v
.
x
)
+
rangle
;
var
angle
=
Math
.
atan2
(
v
.
y
,
v
.
x
)
+
rangle
;
var
length
=
v_tier
.
length
();
var
p2
=
p1
.
clone
();
p2
.
x
+=
Math
.
cos
(
angle
)
*
length
;
p2
.
y
+=
Math
.
sin
(
angle
)
*
length
;
p2
.
x
+=
Math
.
cos
(
angle
)
*
length
;
p2
.
y
+=
Math
.
sin
(
angle
)
*
length
;
var
p3
=
p0
.
clone
().
add
(
v_tier
).
add
(
v_tier
);
var
p3
=
p0
.
clone
().
add
(
v_tier
).
add
(
v_tier
);
snowflake_iteration
(
p0
,
p1
,
depth
);
snowflake_iteration
(
p1
,
p2
,
depth
);
snowflake_iteration
(
p2
,
p3
,
depth
);
snowflake_iteration
(
p3
,
p4
,
depth
);
snowflake_iteration
(
p0
,
p1
,
depth
);
snowflake_iteration
(
p1
,
p2
,
depth
);
snowflake_iteration
(
p2
,
p3
,
depth
);
snowflake_iteration
(
p3
,
p4
,
depth
);
}
function
snowflake
(
points
,
loop
,
x_offset
)
{
function
snowflake
(
points
,
loop
,
x_offset
)
{
for
(
var
iteration
=
0
;
iteration
!=
iteration_count
;
iteration
++
)
{
for
(
var
iteration
=
0
;
iteration
!=
iteration_count
;
++
iteration
)
{
add_vertex
(
points
[
0
]
);
for
(
var
p_index
=
0
,
p_count
=
points
.
length
-
1
;
p_index
!=
p_count
;
p_index
++
)
{
snowflake_iteration
(
points
[
p_index
],
points
[
p_index
+
1
],
iteration
);
add_vertex
(
points
[
0
]);
for
(
var
p_index
=
0
,
p_count
=
points
.
length
-
1
;
p_index
!=
p_count
;
++
p_index
)
{
snowflake_iteration
(
points
[
p_index
],
points
[
p_index
+
1
],
iteration
);
}
if
(
loop
)
snowflake_iteration
(
points
[
points
.
length
-
1
],
points
[
0
],
iteration
);
if
(
loop
)
snowflake_iteration
(
points
[
points
.
length
-
1
],
points
[
0
],
iteration
);
// translate input curve for next iteration
for
(
var
p_index
=
0
,
p_count
=
points
.
length
;
p_index
!=
p_count
;
++
p_index
)
{
for
(
var
p_index
=
0
,
p_count
=
points
.
length
;
p_index
!=
p_count
;
p_index
++
)
{
points
[
p_index
].
x
+=
x_offset
;
}
}
}
var
y
=
0
;
snowflake
(
[
new
THREE
.
Vector3
(
0
,
y
+
0
,
0
),
new
THREE
.
Vector3
(
500
,
y
+
0
,
0
)
new
THREE
.
Vector3
(
0
,
y
,
0
),
new
THREE
.
Vector3
(
500
,
y
,
0
)
],
false
,
600
);
...
...
@@ -144,9 +158,9 @@
snowflake
(
[
new
THREE
.
Vector3
(
0
,
y
+
0
,
0
)
,
new
THREE
.
Vector3
(
250
,
y
+
400
,
0
),
new
THREE
.
Vector3
(
500
,
y
+
0
,
0
)
new
THREE
.
Vector3
(
0
,
y
,
0
)
,
new
THREE
.
Vector3
(
250
,
y
+
400
,
0
),
new
THREE
.
Vector3
(
500
,
y
,
0
)
],
true
,
600
);
...
...
@@ -155,10 +169,10 @@
snowflake
(
[
new
THREE
.
Vector3
(
0
,
y
+
0
,
0
),
new
THREE
.
Vector3
(
500
,
y
,
0
),
new
THREE
.
Vector3
(
500
,
y
+
500
,
0
),
new
THREE
.
Vector3
(
0
,
y
+
500
,
0
)
new
THREE
.
Vector3
(
0
,
y
,
0
),
new
THREE
.
Vector3
(
500
,
y
,
0
),
new
THREE
.
Vector3
(
500
,
y
+
500
,
0
),
new
THREE
.
Vector3
(
0
,
y
+
500
,
0
)
],
true
,
600
);
...
...
@@ -167,21 +181,22 @@
snowflake
(
[
new
THREE
.
Vector3
(
250
,
y
+
0
,
0
),
new
THREE
.
Vector3
(
500
,
y
+
0
,
0
),
new
THREE
.
Vector3
(
250
,
y
+
0
,
0
),
new
THREE
.
Vector3
(
250
,
y
+
250
,
0
),
new
THREE
.
Vector3
(
250
,
y
+
0
,
0
),
new
THREE
.
Vector3
(
0
,
y
,
0
),
new
THREE
.
Vector3
(
250
,
y
+
0
,
0
),
new
THREE
.
Vector3
(
250
,
y
-
250
,
0
),
new
THREE
.
Vector3
(
250
,
y
+
0
,
0
)
new
THREE
.
Vector3
(
250
,
y
,
0
),
new
THREE
.
Vector3
(
500
,
y
,
0
),
new
THREE
.
Vector3
(
250
,
y
,
0
),
new
THREE
.
Vector3
(
250
,
y
+
250
,
0
),
new
THREE
.
Vector3
(
250
,
y
,
0
),
new
THREE
.
Vector3
(
0
,
y
,
0
),
new
THREE
.
Vector3
(
250
,
y
,
0
),
new
THREE
.
Vector3
(
250
,
y
-
250
,
0
),
new
THREE
.
Vector3
(
250
,
y
,
0
)
],
false
,
600
);
// --------------------------------
geometry
.
setIndex
(
indices_array
);
//
geometry
.
setIndex
(
indices
);
geometry
.
addAttribute
(
'
position
'
,
new
THREE
.
Float32BufferAttribute
(
positions
,
3
)
);
geometry
.
addAttribute
(
'
color
'
,
new
THREE
.
Float32BufferAttribute
(
colors
,
3
)
);
geometry
.
computeBoundingSphere
();
...
...
@@ -191,7 +206,7 @@
mesh
.
position
.
y
-=
1200
;
parent_node
=
new
THREE
.
Object3D
();
parent_node
.
add
(
mesh
);
parent_node
.
add
(
mesh
);
scene
.
add
(
parent_node
);
...
...
@@ -239,8 +254,6 @@
var
time
=
Date
.
now
()
*
0.001
;
//mesh.rotation.x = time * 0.25;
//mesh.rotation.y = time * 0.5;
parent_node
.
rotation
.
z
=
time
*
0.5
;
renderer
.
render
(
scene
,
camera
);
...
...
examples/webgl_buffergeometry_points.html
浏览文件 @
845609ee
...
...
@@ -69,14 +69,14 @@
var
geometry
=
new
THREE
.
BufferGeometry
();
var
positions
=
new
Float32Array
(
particles
*
3
)
;
var
colors
=
new
Float32Array
(
particles
*
3
)
;
var
positions
=
[]
;
var
colors
=
[]
;
var
color
=
new
THREE
.
Color
();
var
n
=
1000
,
n2
=
n
/
2
;
// particles spread in the cube
for
(
var
i
=
0
;
i
<
p
ositions
.
length
;
i
+=
3
)
{
for
(
var
i
=
0
;
i
<
p
articles
;
i
++
)
{
// positions
...
...
@@ -84,9 +84,7 @@
var
y
=
Math
.
random
()
*
n
-
n2
;
var
z
=
Math
.
random
()
*
n
-
n2
;
positions
[
i
]
=
x
;
positions
[
i
+
1
]
=
y
;
positions
[
i
+
2
]
=
z
;
positions
.
push
(
x
,
y
,
z
);
// colors
...
...
@@ -96,14 +94,12 @@
color
.
setRGB
(
vx
,
vy
,
vz
);
colors
[
i
]
=
color
.
r
;
colors
[
i
+
1
]
=
color
.
g
;
colors
[
i
+
2
]
=
color
.
b
;
colors
.
push
(
color
.
r
,
color
.
g
,
color
.
b
);
}
geometry
.
addAttribute
(
'
position
'
,
new
THREE
.
BufferAttribute
(
positions
,
3
)
);
geometry
.
addAttribute
(
'
color
'
,
new
THREE
.
BufferAttribute
(
colors
,
3
)
);
geometry
.
addAttribute
(
'
position
'
,
new
THREE
.
Float32
BufferAttribute
(
positions
,
3
)
);
geometry
.
addAttribute
(
'
color
'
,
new
THREE
.
Float32
BufferAttribute
(
colors
,
3
)
);
geometry
.
computeBoundingSphere
();
...
...
examples/webgl_buffergeometry_rawshader.html
浏览文件 @
845609ee
...
...
@@ -113,30 +113,29 @@
var
geometry
=
new
THREE
.
BufferGeometry
();
var
vertices
=
new
Float32Array
(
triangles
*
3
*
3
);
var
positions
=
[];
var
colors
=
[];
for
(
var
i
=
0
,
l
=
triangles
*
3
*
3
;
i
<
l
;
i
+=
3
)
{
for
(
var
i
=
0
;
i
<
triangles
;
i
++
)
{
vertices
[
i
]
=
Math
.
random
()
-
0.5
;
vertices
[
i
+
1
]
=
Math
.
random
()
-
0.5
;
vertices
[
i
+
2
]
=
Math
.
random
()
-
0.5
;
positions
.
push
(
Math
.
random
()
-
0.5
)
;
positions
.
push
(
Math
.
random
()
-
0.5
)
;
positions
.
push
(
Math
.
random
()
-
0.5
)
;
}
geometry
.
addAttribute
(
'
position
'
,
new
THREE
.
BufferAttribute
(
vertices
,
3
)
);
var
colors
=
new
Uint8Array
(
triangles
*
3
*
4
);
colors
.
push
(
Math
.
random
()
*
255
);
colors
.
push
(
Math
.
random
()
*
255
);
colors
.
push
(
Math
.
random
()
*
255
);
colors
.
push
(
Math
.
random
()
*
255
);
for
(
var
i
=
0
,
l
=
triangles
*
3
*
4
;
i
<
l
;
i
+=
4
)
{
}
colors
[
i
]
=
Math
.
random
()
*
255
;
colors
[
i
+
1
]
=
Math
.
random
()
*
255
;
colors
[
i
+
2
]
=
Math
.
random
()
*
255
;
colors
[
i
+
3
]
=
Math
.
random
()
*
255
;
var
positionAttribute
=
new
THREE
.
Float32BufferAttribute
(
positions
,
3
);
var
colorAttribute
=
new
THREE
.
Uint8BufferAttribute
(
colors
,
4
);
}
colorAttribute
.
normalized
=
true
;
// this will map the buffer values to 0.0f - +1.0f in the shader
geometry
.
addAttribute
(
'
color
'
,
new
THREE
.
BufferAttribute
(
colors
,
4
,
true
)
);
geometry
.
addAttribute
(
'
position
'
,
positionAttribute
);
geometry
.
addAttribute
(
'
color
'
,
colorAttribute
);
// material
...
...
examples/webgl_buffergeometry_uint.html
浏览文件 @
845609ee
...
...
@@ -82,22 +82,15 @@
var
geometry
=
new
THREE
.
BufferGeometry
();
var
indices
=
new
Uint32Array
(
triangles
*
3
);
for
(
var
i
=
0
;
i
<
indices
.
length
;
i
++
)
{
indices
[
i
]
=
i
;
}
var
positions
=
new
Float32Array
(
triangles
*
3
*
3
);
var
normals
=
new
Int16Array
(
triangles
*
3
*
3
);
var
colors
=
new
Uint8Array
(
triangles
*
3
*
3
);
var
indices
=
[];
var
positions
=
[];
var
normals
=
[];
var
colors
=
[];
var
color
=
new
THREE
.
Color
();
var
n
=
800
,
n2
=
n
/
2
;
// triangles spread in the cube
var
d
=
12
,
d2
=
d
/
2
;
// individual triangle size
var
n
=
800
,
n2
=
n
/
2
;
// triangles spread in the cube
var
d
=
12
,
d2
=
d
/
2
;
// individual triangle size
var
pA
=
new
THREE
.
Vector3
();
var
pB
=
new
THREE
.
Vector3
();
...
...
@@ -106,7 +99,7 @@
var
cb
=
new
THREE
.
Vector3
();
var
ab
=
new
THREE
.
Vector3
();
for
(
var
i
=
0
;
i
<
positions
.
length
;
i
+=
9
)
{
for
(
var
i
=
0
;
i
<
triangles
;
i
++
)
{
// positions
...
...
@@ -126,17 +119,9 @@
var
cy
=
y
+
Math
.
random
()
*
d
-
d2
;
var
cz
=
z
+
Math
.
random
()
*
d
-
d2
;
positions
[
i
]
=
ax
;
positions
[
i
+
1
]
=
ay
;
positions
[
i
+
2
]
=
az
;
positions
[
i
+
3
]
=
bx
;
positions
[
i
+
4
]
=
by
;
positions
[
i
+
5
]
=
bz
;
positions
[
i
+
6
]
=
cx
;
positions
[
i
+
7
]
=
cy
;
positions
[
i
+
8
]
=
cz
;
positions
.
push
(
ax
,
ay
,
az
);
positions
.
push
(
bx
,
by
,
bz
);
positions
.
push
(
cx
,
cy
,
cz
);
// flat face normals
...
...
@@ -154,17 +139,9 @@
var
ny
=
cb
.
y
;
var
nz
=
cb
.
z
;
normals
[
i
]
=
nx
*
32767
;
normals
[
i
+
1
]
=
ny
*
32767
;
normals
[
i
+
2
]
=
nz
*
32767
;
normals
[
i
+
3
]
=
nx
*
32767
;
normals
[
i
+
4
]
=
ny
*
32767
;
normals
[
i
+
5
]
=
nz
*
32767
;
normals
[
i
+
6
]
=
nx
*
32767
;
normals
[
i
+
7
]
=
ny
*
32767
;
normals
[
i
+
8
]
=
nz
*
32767
;
normals
.
push
(
nx
*
32767
,
ny
*
32767
,
nz
*
32767
);
normals
.
push
(
nx
*
32767
,
ny
*
32767
,
nz
*
32767
);
normals
.
push
(
nx
*
32767
,
ny
*
32767
,
nz
*
32767
);
// colors
...
...
@@ -174,24 +151,22 @@
color
.
setRGB
(
vx
,
vy
,
vz
);
colors
[
i
]
=
color
.
r
*
255
;
colors
[
i
+
1
]
=
color
.
g
*
255
;
colors
[
i
+
2
]
=
color
.
b
*
255
;
colors
.
push
(
color
.
r
*
255
,
color
.
g
*
255
,
color
.
b
*
255
)
;
colors
.
push
(
color
.
r
*
255
,
color
.
g
*
255
,
color
.
b
*
255
)
;
colors
.
push
(
color
.
r
*
255
,
color
.
g
*
255
,
color
.
b
*
255
)
;
colors
[
i
+
3
]
=
color
.
r
*
255
;
colors
[
i
+
4
]
=
color
.
g
*
255
;
colors
[
i
+
5
]
=
color
.
b
*
255
;
}
colors
[
i
+
6
]
=
color
.
r
*
255
;
colors
[
i
+
7
]
=
color
.
g
*
255
;
colors
[
i
+
8
]
=
color
.
b
*
255
;
var
positionAttribute
=
new
THREE
.
Float32BufferAttribute
(
positions
,
3
)
;
var
normalAttribute
=
new
THREE
.
Int16BufferAttribute
(
normals
,
3
)
;
var
colorAttribute
=
new
THREE
.
Uint8BufferAttribute
(
colors
,
3
)
;
}
normalAttribute
.
normalized
=
true
;
// this will map the buffer values to 0.0f - +1.0f in the shader
colorAttribute
.
normalized
=
true
;
geometry
.
setIndex
(
new
THREE
.
BufferAttribute
(
indices
,
1
)
);
geometry
.
addAttribute
(
'
position
'
,
new
THREE
.
BufferAttribute
(
positions
,
3
)
);
geometry
.
addAttribute
(
'
normal
'
,
new
THREE
.
BufferAttribute
(
normals
,
3
,
true
)
);
geometry
.
addAttribute
(
'
color
'
,
new
THREE
.
BufferAttribute
(
colors
,
3
,
true
)
);
geometry
.
addAttribute
(
'
position
'
,
positionAttribute
);
geometry
.
addAttribute
(
'
normal
'
,
normalAttribute
);
geometry
.
addAttribute
(
'
color
'
,
colorAttribute
);
geometry
.
computeBoundingSphere
();
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录