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
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
|
<!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>
[page:Geometry] → [page:ExtrudeGeometry] →
<h1>文本几何体（[name]）</h1>
<p class="desc">
一个用于将文本生成为单一的几何体的类。
它是由一串给定的文本，以及由加载的[page:Font]（字体）和该几何体[page:ExtrudeGeometry]父类中的设置所组成的参数来构造的。
请参阅[page:Font]、[page:FontLoader]和[page:Creating_Text]页面来查看更多详细信息。
</p>
<iframe id="scene" src="scenes/geometry-browser.html#TextGeometry"></iframe>
<script>
// iOS iframe auto-resize workaround
if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
var scene = document.getElementById( 'scene' );
scene.style.width = getComputedStyle( scene ).width;
scene.style.height = getComputedStyle( scene ).height;
scene.setAttribute( 'scrolling', 'no' );
}
</script>
<h2>示例</h2>
<p>
[example:webgl_geometry_text geometry / text ]
</p>
<code>
var loader = new THREE.FontLoader();
loader.load( 'fonts/helvetiker_regular.typeface.json', function ( font ) {
var geometry = new THREE.TextGeometry( 'Hello three.js!', {
font: font,
size: 80,
height: 5,
curveSegments: 12,
bevelEnabled: true,
bevelThickness: 10,
bevelSize: 8,
bevelSegments: 5
} );
} );
</code>
<h2>构造器</h2>
<h3>[name]([param:String text], [param:Object parameters])</h3>
<p>
text — 将要显示的文本。<br />
parameters — 包含有下列参数的对象：
<ul>
<li>font — THREE.Font的实例。</li>
<li>size — Float。字体大小，默认值为100。</li>
<li>height — Float。挤出文本的厚度。默认值为50。</li>
<li>curveSegments — Integer。（表示文本的）曲线上点的数量。默认值为12。</li>
<li>bevelEnabled — Boolean。是否开启斜角，默认为false。</li>
<li>bevelThickness — Float。文本上斜角的深度，默认值为20。</li>
<li>bevelSize — Float。斜角与原始文本轮廓之间的延伸距离。默认值为8。</li>
<li>bevelSegments — Integer。斜角的分段数。默认值为3。</li>
</ul>
</p>
<h2>可用的字体</h2>
<p>
文本几何体使用 <a href='http://gero3.github.io/facetype.js/' target="_top">typeface.json</a>所生成的字体。
一些已有的字体可以在<b>/examples/fonts</b>中找到，且必须在页面中引入。
</p>
<table>
<tr>
<th>字体</th>
<th>字重</th>
<th>风格</th>
<th>文件路径</th>
</tr>
<tr>
<td>helvetiker</td>
<td>normal</td>
<td>normal</td>
<td>/examples/fonts/helvetiker_regular.typeface.json</td>
</tr>
<tr>
<td>helvetiker</td>
<td>bold</td>
<td>normal</td>
<td>/examples/fonts/helvetiker_bold.typeface.json</td>
</tr>
<tr>
<td>optimer</td>
<td>normal</td>
<td>normal</td>
<td>/examples/fonts/optimer_regular.typeface.json</td>
</tr>
<tr>
<td>optimer</td>
<td>bold</td>
<td>normal</td>
<td>/examples/fonts/optimer_bold.typeface.json</td>
</tr>
<tr>
<td>gentilis</td>
<td>normal</td>
<td>normal</td>
<td>/examples/fonts/gentilis_regular.typeface.json</td>
</tr>
<tr>
<td>gentilis</td>
<td>bold</td>
<td>normal</td>
<td>/examples/fonts/gentilis_bold.typeface.json</td>
</tr>
<tr>
<td>droid sans</td>
<td>normal</td>
<td>normal</td>
<td>/examples/fonts/droid/droid_sans_regular.typeface.json</td>
</tr>
<tr>
<td>droid sans</td>
<td>bold</td>
<td>normal</td>
<td>/examples/fonts/droid/droid_sans_bold.typeface.json</td>
</tr>
<tr>
<td>droid serif</td>
<td>normal</td>
<td>normal</td>
<td>/examples/fonts/droid/droid_serif_regular.typeface.json</td>
</tr>
<tr>
<td>droid serif</td>
<td>bold</td>
<td>normal</td>
<td>/examples/fonts/droid/droid_serif_bold.typeface.json</td>
</tr>
</table>
<h2>属性</h2>
<p>共有属性请参见其基类[page:ExtrudeGeometry]。</p>
<h3>[property:Object parameters]</h3>
<p>
一个包含着构造函数中每个参数的对象。在对象实例化之后，对该属性的任何修改都不会改变这个几何体。
</p>
<h2>方法(Methods)</h2>
<p>共有方法请参见其基类[page:ExtrudeGeometry]。</p>
<h2>源代码</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
|
