TextGeometry.html 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8" />
  5. <base href="../../" />
  6. <script src="list.js"></script>
  7. <script src="page.js"></script>
  8. <link type="text/css" rel="stylesheet" href="page.css" />
  9. </head>
  10. <body>
  11. [page:ExtrudeGeometry] &rarr;
  12. <h1>[name]</h1>
  13. <div class="desc">This object creates a 3D object of text as a single object.</div>
  14. <iframe id="scene" src="scenes/geometry-browser.html#TextGeometry"></iframe>
  15. <script>
  16. // iOS iframe auto-resize workaround
  17. if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
  18. var scene = document.getElementById( 'scene' );
  19. scene.style.width = getComputedStyle( scene ).width;
  20. scene.style.height = getComputedStyle( scene ).height;
  21. scene.setAttribute( 'scrolling', 'no' );
  22. }
  23. </script>
  24. <h2>Example</h2>
  25. <div>
  26. [example:webgl_geometry_text geometry / text ]<br/>
  27. [example:webgl_geometry_text2 geometry / text2 ]
  28. </div>
  29. <h2>Constructor</h2>
  30. <h3>[name]([page:String text], [page:Object parameters])</h3>
  31. <div>
  32. text — The text that needs to be shown. <br />
  33. parameters — Object that can contains the following parameters.
  34. <ul>
  35. <li>font — THREE.Font.</li>
  36. <li>size — Float. Size of the text.</li>
  37. <li>height — Float. Thickness to extrude text. Default is 50.</li>
  38. <li>curveSegments — Integer. Number of points on the curves. Default is 12.</li>
  39. <li>bevelEnabled — Boolean. Turn on bevel. Default is False.</li>
  40. <li>bevelThickness — Float. How deep into text bevel goes. Default is 10.</li>
  41. <li>bevelSize — Float. How far from text outline is bevel. Default is 8.</li>
  42. </ul>
  43. </div>
  44. <h2>Available Fonts</h2>
  45. <div>
  46. TextGeometry uses <a href='http://gero3.github.io/facetype.js/' target="_top">typeface.json</a> generated fonts.
  47. Some existing fonts can be found located in <b>/examples/fonts</b> and must be included in the page.
  48. </div>
  49. <table>
  50. <tr>
  51. <th>Font</th>
  52. <th>Weight</th>
  53. <th>Style</th>
  54. <th>File Path</th>
  55. </tr>
  56. <tr>
  57. <td>helvetiker</td>
  58. <td>normal</td>
  59. <td>normal</td>
  60. <td>/examples/fonts/helvetiker_regular.typeface.json</td>
  61. </tr>
  62. <tr>
  63. <td>helvetiker</td>
  64. <td>bold</td>
  65. <td>normal</td>
  66. <td>/examples/fonts/helvetiker_bold.typeface.json</td>
  67. </tr>
  68. <tr>
  69. <td>optimer</td>
  70. <td>normal</td>
  71. <td>normal</td>
  72. <td>/examples/fonts/optimer_regular.typeface.json</td>
  73. </tr>
  74. <tr>
  75. <td>optimer</td>
  76. <td>bold</td>
  77. <td>normal</td>
  78. <td>/examples/fonts/optimer_bold.typeface.json</td>
  79. </tr>
  80. <tr>
  81. <td>gentilis</td>
  82. <td>normal</td>
  83. <td>normal</td>
  84. <td>/examples/fonts/gentilis_regular.typeface.json</td>
  85. </tr>
  86. <tr>
  87. <td>gentilis</td>
  88. <td>bold</td>
  89. <td>normal</td>
  90. <td>/examples/fonts/gentilis_bold.typeface.json</td>
  91. </tr>
  92. <tr>
  93. <td>droid sans</td>
  94. <td>normal</td>
  95. <td>normal</td>
  96. <td>/examples/fonts/droid/droid_sans_regular.typeface.json</td>
  97. </tr>
  98. <tr>
  99. <td>droid sans</td>
  100. <td>bold</td>
  101. <td>normal</td>
  102. <td>/examples/fonts/droid/droid_sans_bold.typeface.json</td>
  103. </tr>
  104. <tr>
  105. <td>droid serif</td>
  106. <td>normal</td>
  107. <td>normal</td>
  108. <td>/examples/fonts/droid/droid_serif_regular.typeface.json</td>
  109. </tr>
  110. <tr>
  111. <td>droid serif</td>
  112. <td>bold</td>
  113. <td>normal</td>
  114. <td>/examples/fonts/droid/droid_serif_bold.typeface.json</td>
  115. </tr>
  116. </table>
  117. <h2>Source</h2>
  118. [link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
  119. </body>
  120. </html>