123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169 |
- <!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:ExtrudeGeometry] →
- <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 set of
- parameters consisting of a loaded font and settings for the geometry's parent [page:ExtrudeGeometry].
- See the [page:FontLoader] page for additional details.
- </p>
- <h2>Import</h2>
- <p>
- [name] is an add-on, and must be imported explicitly.
- See [link:#manual/introduction/Installation Installation / Addons].
- </p>
- <code>
- import { TextGeometry } from 'three/addons/geometries/TextGeometry.js';
- </code>
- <h2>Code Example</h2>
- <code>
- const loader = new FontLoader();
- loader.load( 'fonts/helvetiker_regular.typeface.json', function ( font ) {
- const geometry = new TextGeometry( 'Hello three.js!', {
- font: font,
- size: 80,
- depth: 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>depth — 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:ExtrudeGeometry] 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:ExtrudeGeometry] class for common methods.</p>
- <h2>Source</h2>
- <p>
- [link:https://github.com/mrdoob/three.js/blob/master/examples/jsm/geometries/TextGeometry.js examples/jsm/geometries/TextGeometry.js]
- </p>
- </body>
- </html>
|