1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
|
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
<h1>[name]</h1>
<p class="desc">
Triangular face used in [page:Geometry]. These are created automatically for all
standard geometry types, however if you are building a custom geometry you will have to
create them manually.
</p>
<h2>Examples</h2>
<p>[example:svg_sandbox svg / sandbox ]</p>
<p>[example:misc_exporter_obj exporter / obj ]</p>
<p>[example:webgl_shaders_vector WebGL / shaders / vector ]</p>
<code>
var material = new THREE.MeshStandardMaterial( { color : 0x00cc00 } );
//create a triangular geometry
var geometry = new THREE.Geometry();
geometry.vertices.push( new THREE.Vector3( -50, -50, 0 ) );
geometry.vertices.push( new THREE.Vector3( 50, -50, 0 ) );
geometry.vertices.push( new THREE.Vector3( 50, 50, 0 ) );
//create a new face using vertices 0, 1, 2
var normal = new THREE.Vector3( 0, 1, 0 ); //optional
var color = new THREE.Color( 0xffaa00 ); //optional
var materialIndex = 0; //optional
var face = new THREE.Face3( 0, 1, 2, normal, color, materialIndex );
//add the face to the geometry's faces array
geometry.faces.push( face );
//the face normals and vertex normals can be calculated automatically if not supplied above
geometry.computeFaceNormals();
geometry.computeVertexNormals();
scene.add( new THREE.Mesh( geometry, material ) );
</code>
<h2>Constructor</h2>
<h3>[name]( [param:Integer a], [param:Integer b], [param:Integer c], [param:Vector3 normal], [param:Color color], [param:Integer materialIndex] )</h3>
<p>
a — Vertex A index.<br />
b — Vertex B index.<br />
c — Vertex C index.<br /><br />
normal — (optional) Face normal ([page:Vector3 Vector3]) or array of vertex normals.
If a single vector is passed in, this sets [page:.normal], otherwise if an array of three
vectors is passed in this sets [page:.vertexNormals]<br /><br />
color — (optional) Face [page:Color color] or array of vertex [page:Color colors].
If a single vector is passed in, this sets [page:.color], otherwise if an array of three
vectors is passed in this sets [page:.vertexColors]<br /><br />
materialIndex — (optional) which index of an array of materials to associate
with the face.
</p>
<h2>Properties</h2>
<h3>[property:Integer a]</h3>
<p>
Vertex A index.
</p>
<h3>[property:Integer b]</h3>
<p>
Vertex B index.
</p>
<h3>[property:Integer c]</h3>
<p>
Vertex C index.
</p>
<h3>[property:Vector3 normal]</h3>
<p>
Face normal - vector showing the direction of the Face3. If calculated automatically
(using [page:Geometry.computeFaceNormals]), this is the normalized cross product of two edges of the
triangle. Default is *(0, 0, 0)*.
</p>
<h3>[property:Color color]</h3>
<p>
Face color - for this to be used a material's [page:Material.vertexColors vertexColors] property
must be set to [page:Materials THREE.FaceColors].
</p>
<h3>[property:Array vertexNormals]</h3>
<p>
Array of 3 [page:Vector3 vertex normals].
</p>
<h3>[property:Array vertexColors]</h3>
<p>
Array of 3 vertex colors - for these to be used a material's [page:Material.vertexColors vertexColors] property
must be set to [page:Materials THREE.VertexColors].
</p>
<h3>[property:Integer materialIndex]</h3>
<p>
Material index (points to an index in the associated array of materials). Default is *0*.
</p>
<h2>Methods</h2>
<h3>[method:Face3 clone]()</h3>
<p>Creates a new clone of the Face3 object.</p>
<h3>[method:Face3 copy]( [param:Face3 face3] )</h3>
<p>Copy the parameters of another Face3 into this.</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
|
