Wireframe.html 4.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Wireframe - Three.js Docs</title>
  6. <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
  7. <script src="../scripts/highlight.min.js"></script>
  8. <link type="text/css" rel="stylesheet" href="../styles/highlight-three.css">
  9. <link type="text/css" rel="stylesheet" href="../styles/page.css">
  10. </head>
  11. <body>
  12. <p class="inheritance" translate="no"><a href="EventDispatcher.html">EventDispatcher</a> → <a href="Object3D.html">Object3D</a> → <a href="Mesh.html">Mesh</a> → </p>
  13. <h1 translate="no">Wireframe</h1>
  14. <section>
  15. <header>
  16. <div class="class-description"><p>A class for creating wireframes based on wide lines.</p>
  17. <p>This module can only be used with <a href="WebGLRenderer.html">WebGLRenderer</a>. When using <a href="WebGPURenderer.html">WebGPURenderer</a>,
  18. import the class from <code>lines/webgpu/Wireframe.js</code>.</p></div>
  19. <h2>Code Example</h2>
  20. <div translate="no"><pre><code class="language-js">const geometry = new THREE.IcosahedronGeometry();
  21. const wireframeGeometry = new WireframeGeometry2( geo );
  22. const wireframe = new Wireframe( wireframeGeometry, material );
  23. scene.add( wireframe );
  24. </code></pre></div>
  25. </header>
  26. <article>
  27. <h2 class="subsection-title">Import</h2>
  28. <p><span translate="no">Wireframe</span> is an addon, and must be imported explicitly, see <a href="https://threejs.org/manual/#en/installation" target="_blank" rel="noopener">Installation#Addons</a>.</p>
  29. <pre><code class="language-js">import { Wireframe } from 'three/addons/lines/Wireframe.js';</code></pre>
  30. <div class="container-overview">
  31. <h2>Constructor</h2>
  32. <h3 class="name name-method" id="Wireframe" translate="no">new <a href="#Wireframe">Wireframe</a><span class="signature">( geometry : <span class="param-type"><a href="LineSegmentsGeometry.html">LineSegmentsGeometry</a></span>, material : <span class="param-type"><a href="LineMaterial.html">LineMaterial</a></span> )</span> </h3>
  33. <div class="method">
  34. <div class="description">
  35. <p>Constructs a new wireframe.</p>
  36. </div>
  37. <table class="params">
  38. <tbody>
  39. <tr>
  40. <td class="name">
  41. <strong>geometry</strong>
  42. </td>
  43. <td class="description last">
  44. <p>The line geometry.</p>
  45. </td>
  46. </tr>
  47. <tr>
  48. <td class="name">
  49. <strong>material</strong>
  50. </td>
  51. <td class="description last">
  52. <p>The line material.</p>
  53. </td>
  54. </tr>
  55. </tbody>
  56. </table>
  57. </div>
  58. </div>
  59. <h2 class="subsection-title">Properties</h2>
  60. <div class="member">
  61. <h3 class="name" id="isWireframe" translate="no">.<a href="#isWireframe">isWireframe</a><span class="type-signature"> : boolean</span> <span class="type-signature">(readonly) </span></h3>
  62. <div class="description">
  63. <p>This flag can be used for type testing.</p>
  64. <p>Default is <code>true</code>.</p>
  65. </div>
  66. </div>
  67. <h2 class="subsection-title">Methods</h2>
  68. <h3 class="name name-method" id="computeLineDistances" translate="no">.<a href="#computeLineDistances">computeLineDistances</a><span class="signature">()</span><span class="type-signature"> : <a href="Wireframe.html">Wireframe</a></span> </h3>
  69. <div class="method">
  70. <div class="description">
  71. <p>Computes an array of distance values which are necessary for rendering dashed lines.
  72. For each vertex in the geometry, the method calculates the cumulative length from the
  73. current point to the very beginning of the line.</p>
  74. </div>
  75. <dl class="details">
  76. <dt class="tag-returns"><strong>Returns:</strong> A reference to this instance.</dt>
  77. </dl>
  78. </div>
  79. <h2 class="subsection-title">Source</h2>
  80. <p>
  81. <a href="https://github.com/mrdoob/three.js/blob/master/examples/jsm/lines/Wireframe.js" translate="no" target="_blank" rel="noopener">examples/jsm/lines/Wireframe.js</a>
  82. </p>
  83. </article>
  84. </section>
  85. <script src="../scripts/linenumber.js"></script>
  86. <script src="../scripts/page.js"></script>
  87. </body>
  88. </html>
粤ICP备19079148号