|
@@ -1,176 +0,0 @@
|
|
|
-<!DOCTYPE html>
|
|
|
-<html lang="en">
|
|
|
- <head>
|
|
|
- <meta charset="utf-8" />
|
|
|
- <base href="../../../" />
|
|
|
- <script src="page.js"></script>
|
|
|
- <link type="text/css" rel="stylesheet" href="page.css" />
|
|
|
- </head>
|
|
|
- <body>
|
|
|
- [page:BufferGeometry] → [page:ExtrudeBufferGeometry] →
|
|
|
-
|
|
|
- <h1>[name]</h1>
|
|
|
-
|
|
|
- <p class="desc">
|
|
|
- A class for generating text as a single geometry. It is constructed by providing a string of text, and a hash of
|
|
|
- parameters consisting of a loaded [page:Font] and settings for the geometry's parent [page:ExtrudeBufferGeometry].
|
|
|
- See the [page:Font], [page:FontLoader] and [page:Creating_Text] pages for additional details.
|
|
|
- </p>
|
|
|
-
|
|
|
- <iframe id="scene" src="scenes/geometry-browser.html#TextBufferGeometry"></iframe>
|
|
|
-
|
|
|
- <script>
|
|
|
-
|
|
|
- // iOS iframe auto-resize workaround
|
|
|
-
|
|
|
- if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
|
|
|
-
|
|
|
- const scene = document.getElementById( 'scene' );
|
|
|
-
|
|
|
- scene.style.width = getComputedStyle( scene ).width;
|
|
|
- scene.style.height = getComputedStyle( scene ).height;
|
|
|
- scene.setAttribute( 'scrolling', 'no' );
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- </script>
|
|
|
-
|
|
|
- <h2>Code Example</h2>
|
|
|
-
|
|
|
- <code>
|
|
|
- const loader = new THREE.FontLoader();
|
|
|
-
|
|
|
- loader.load( 'fonts/helvetiker_regular.typeface.json', function ( font ) {
|
|
|
-
|
|
|
- const geometry = new THREE.TextBufferGeometry( 'Hello three.js!', {
|
|
|
- font: font,
|
|
|
- size: 80,
|
|
|
- height: 5,
|
|
|
- curveSegments: 12,
|
|
|
- bevelEnabled: true,
|
|
|
- bevelThickness: 10,
|
|
|
- bevelSize: 8,
|
|
|
- bevelOffset: 0,
|
|
|
- bevelSegments: 5
|
|
|
- } );
|
|
|
- } );
|
|
|
- </code>
|
|
|
-
|
|
|
- <h2>Examples</h2>
|
|
|
-
|
|
|
- <p>
|
|
|
- [example:webgl_geometry_text geometry / text ]
|
|
|
- </p>
|
|
|
-
|
|
|
- <h2>Constructor</h2>
|
|
|
-
|
|
|
- <h3>[name]([param:String text], [param:Object parameters])</h3>
|
|
|
- <p>
|
|
|
- text — The text that needs to be shown. <br />
|
|
|
- parameters — Object that can contains the following parameters.
|
|
|
- <ul>
|
|
|
- <li>font — an instance of THREE.Font.</li>
|
|
|
- <li>size — Float. Size of the text. Default is 100.</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>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>
|
|
|
- <li>bevelOffset — Float. How far from text outline bevel starts. Default is 0.</li>
|
|
|
- <li>bevelSegments — Integer. Number of bevel segments. Default is 3.</li>
|
|
|
- </ul>
|
|
|
- </p>
|
|
|
-
|
|
|
- <h2>Available Fonts</h2>
|
|
|
-
|
|
|
- <p>
|
|
|
- TextGeometry uses <a href='http://gero3.github.io/facetype.js/' target="_top">typeface.json</a> generated fonts.
|
|
|
- Some existing fonts can be found located in <b>/examples/fonts</b> and must be included in the page.
|
|
|
- </p>
|
|
|
- <table>
|
|
|
- <tr>
|
|
|
- <th>Font</th>
|
|
|
- <th>Weight</th>
|
|
|
- <th>Style</th>
|
|
|
- <th>File Path</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>Properties</h2>
|
|
|
- <p>See the base [page:ExtrudeBufferGeometry] class for common properties.</p>
|
|
|
-
|
|
|
- <h3>[property:Object parameters]</h3>
|
|
|
- <p>
|
|
|
- An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
|
|
|
- </p>
|
|
|
-
|
|
|
- <h2>Methods</h2>
|
|
|
- <p>See the base [page:ExtrudeBufferGeometry] class for common methods.</p>
|
|
|
-
|
|
|
- <h2>Source</h2>
|
|
|
-
|
|
|
- <p>
|
|
|
- [link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
|
|
|
- </p>
|
|
|
- </body>
|
|
|
-</html>
|