Skip to content

T
three.js

车家大少爷 / three.js
与 Fork 源项目一致

从无法访问的项目Fork

通知 2
Star 0
Fork 0
T
three.js

体验新版 GitCode，发现更多精彩内容 >>

提交 a2f63e32 编写于 作者: M Mr.doob
浏览文件
操作

Docs: Updated with new TextGeometry API.

上级 f0e0f5be
隐藏空白更改
内联 并排
Showing with 32 addition and 149 deletion
docs/api/extras/FontUtils.html 已删除 100644 → 0
浏览文件 @ f0e0f5be
<!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>
<div class="desc">A class for text operations in three.js (See [page:TextGeometry])</div>
<h2>Properties</h2>
<h3>[property:number divisions]</h3>
<div>
The amount of segments in a curve. Default is 10.
</div>
<h3>[property:string style]</h3>
<div>
The style of the used font. Default is "normal".
</div>
<h3>[property:string weight]</h3>
<div>
The weight of the used font. Default is "normal".
</div>
<h3>[property:string face]</h3>
<div>
The name of the font. Default is "helvetiker".
</div>
<h3>[property:object faces]</h3>
<div>
All Fonts which are already loaded in.
</div>
<h3>[property:number size]</h3>
<div>
The size of the used Font. Default is 150.
</div>
<h2>Methods</h2>
<h3>[method:Object drawText]([page:string text])</h3>
<div>
text -- The text to draw.
</div>
<div>
Calculates the path and offset of the text in the used font. It returns an object like { paths : fontPaths, offset : width }.
</div>
<h3>[method:Array Triangulate]([page:Array contour], [page:Boolean indices])</h3>
<div>
contour -- Array of vector2 to define an contour <br />
indices -- A boolean indicating if you need to return indices.
</div>
<div>
Triangulates a contour into an array of faces.
</div>
<h3>[method:Object extractGlyphPoints]([page:string c], [page:string face], [page:number scale], [page:number offset], [page:Path path])</h3>
<div>
c -- The character to extract. <br />
face -- The face to use. <br />
scale -- The scale of the character. <br />
offset -- The offset of the character compared to begin of the path. <br />
path -- The path to which to add the character points.
</div>
<div>
This ectracts the glyphPoints of the character of the face and returns an object containing the path and the new offset.
</div>
<h3>[method:Array generateShapes]([page:string text], [page:Object parameters])</h3>
<div>
text -- The text to generate the shapes from.<br />
parameters -- The parameter containing <br />
size -- Default is 100.
curveSegments -- Default is 4.
font -- Default is "helvetiker".
weight -- Default is "normal".
style -- Default is "normal".
</div>
<div>
Generates shapes from the text and return them as an Array of [page:Shape].
</div>
<h3>[method:Object loadFace]([page:Object data])</h3>
<div>
data -- The data of the face.
</div>
<div>
This loads and saves the data of the face and return the data. When you add the font Data as javascriptfile, then this automatically get called. So there is no need to do this yourself.
</div>
<h3>[method:Object getFace]()</h3>
<div>
Returns the used font its data based on its style and weight.
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
docs/api/extras/geometries/TextGeometry.html
浏览文件 @ a2f63e32
......@@ -31,12 +31,10 @@
text — The text that needs to be shown. <br />
parameters — Object that can contains the following parameters.
<ul>
<li>font — THREE.Font.</li>
<li>size — Float. Size of the text.</li>
<li>height — Float. Thickness to extrude text. Default is 50.</li>
<li>curveSegments — Integer. Number of points on the curves. Default is 12.</li>
<li>font — String. Font name.</li>
<li>weight — String. Font weight (normal, bold).</li>
<li>style — String. Font style (normal, italics).</li>
<li>bevelEnabled — Boolean. Turn on bevel. Default is False.</li>
<li>bevelThickness — Float. How deep into text bevel goes. Default is 10.</li>
<li>bevelSize — Float. How far from text outline is bevel. Default is 8.</li>
......
docs/list.js
浏览文件 @ a2f63e32
......@@ -9,11 +9,11 @@ var list = {
"Reference": {
"Constants": [
[ "CustomBlendingEquation", "api/constants/CustomBlendingEquations"],
[ "GLState", "api/constants/GLState"],
[ "Materials", "api/constants/Materials"],
[ "ShadowingTypes", "api/constants/ShadowingTypes"],
[ "Textures", "api/constants/Textures"]
[ "CustomBlendingEquation", "api/constants/CustomBlendingEquations" ],
[ "GLState", "api/constants/GLState" ],
[ "Materials", "api/constants/Materials" ],
[ "ShadowingTypes", "api/constants/ShadowingTypes" ],
[ "Textures", "api/constants/Textures" ]
],
"Cameras": [
......@@ -151,13 +151,12 @@ var list = {
"Textures": [
[ "CompressedTexture", "api/textures/CompressedTexture" ],
[ "CubeTexture", "api/textures/CubeTexture" ],
[ "CubeTexture", "api/textures/CubeTexture" ],
[ "DataTexture", "api/textures/DataTexture" ],
[ "Texture", "api/textures/Texture" ]
],
"Extras": [
[ "FontUtils", "api/extras/FontUtils" ],
[ "GeometryUtils", "api/extras/GeometryUtils" ],
[ "SceneUtils", "api/extras/SceneUtils" ]
],
......
docs/scenes/geometry-browser.html
浏览文件 @ a2f63e32
......@@ -37,16 +37,6 @@
<script src="../../build/three.min.js"></script>
<script src='../../examples/js/libs/dat.gui.min.js'></script>
<script src="../../examples/js/controls/OrbitControls.js"></script>
<script src="../../examples/js/geometries/TextGeometry.js"></script>
<script src="../../examples/js/utils/FontUtils.js"></script>
<script src="../../examples/fonts/gentilis_bold.typeface.js"></script>
<script src="../../examples/fonts/gentilis_regular.typeface.js"></script>
<script src="../../examples/fonts/optimer_bold.typeface.js"></script>
<script src="../../examples/fonts/optimer_regular.typeface.js"></script>
<script src="../../examples/fonts/helvetiker_bold.typeface.js"></script>
<script src="../../examples/fonts/helvetiker_regular.typeface.js"></script>
<script src="../../examples/fonts/droid/droid_serif_regular.typeface.js"></script>
<script src="../../examples/fonts/droid/droid_serif_bold.typeface.js"></script>
<script src='js/geometry.js'></script>
......@@ -60,7 +50,7 @@
camera.position.z = 30;
var renderer = new THREE.WebGLRenderer( { antialias: true } );
renderer.setPixelRatio( window.devicePixelRatio );
renderer.setPixelRatio( window.devicePixelRatio );
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
......
docs/scenes/js/geometry.js
浏览文件 @ a2f63e32
......@@ -408,8 +408,7 @@ var guis = {
height : 2,
curveSegments : 12,
font : "helvetiker",
weight : "normal",
style : "normal",
weight : "regular",
bevelEnabled : false,
bevelThickness : 1,
bevelSize : 0.5
......@@ -419,40 +418,52 @@ var guis = {
"helvetiker",
"optimer",
"gentilis",
"droid serif"
]
"droid/droid_serif"
];
var weights = [
"normal", "bold"
]
"regular", "bold"
];
function generateGeometry() {
var geometry = new THREE.TextGeometry( data.text, data )
var loader = new THREE.FontLoader();
loader.load( '../../examples/fonts/' + data.font + '_' + data.weight + '.typeface.json', function ( font ) {
geometry.center()
var geometry = new THREE.TextGeometry( data.text, {
font: font,
size: data.size,
height: data.height,
curveSegments: data.curveSegments,
bevelEnabled: data.bevelEnabled,
bevelThickness: data.bevelThickness,
bevelSize: data.bevelSize
} );
geometry.center();
updateGroupGeometry( mesh, geometry );
updateGroupGeometry( mesh, geometry );
} );
}
//Hide the wireframe
mesh.children[0].visible = false;
mesh.children[ 0 ].visible = false;
var folder = gui.addFolder('THREE.TextGeometry');
var folder = gui.addFolder( 'THREE.TextGeometry' );
folder.add( data, 'text' ).onChange( generateGeometry );
folder.add( data, 'size', 1, 30 ).onChange( generateGeometry );
folder.add( data, 'height', 1, 20 ).onChange( generateGeometry );
folder.add( data, 'curveSegments', 1, 20 ).step(1).onChange( generateGeometry );
folder.add( data, 'curveSegments', 1, 20 ).step( 1 ).onChange( generateGeometry );
folder.add( data, 'font', fonts ).onChange( generateGeometry );
folder.add( data, 'weight', weights ).onChange( generateGeometry );
// folder.add( data, 'style', 1, 1 ).onChange( generateGeometry );
folder.add( data, 'bevelEnabled' ).onChange( generateGeometry );
folder.add( data, 'bevelThickness', 0.1, 3 ).onChange( generateGeometry );
folder.add( data, 'bevelSize', 0.1, 3 ).onChange( generateGeometry );
generateGeometry();
},
TorusGeometry : function( mesh ) {
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或