samien
/
three.js
spiegel van https://github.com/mrdoob/three.js.git


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122
							<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>LineSegments2 - Three.js Docs</title>
	<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
	<script src="../scripts/highlight.min.js"></script>
	<link type="text/css" rel="stylesheet" href="../styles/highlight-three.css">
	<link type="text/css" rel="stylesheet" href="../styles/page.css">
</head>
<body>
		<p class="inheritance" translate="no"><a href="EventDispatcher.html">EventDispatcher</a> → <a href="Object3D.html">Object3D</a> → <a href="Mesh.html">Mesh</a> → </p>
	<h1 translate="no">LineSegments2</h1>
		<section>
			<header>
				<div class="class-description"><p>A series of lines drawn between pairs of vertices.</p>
<p>This adds functionality beyond <a href="LineSegments.html">LineSegments</a>, like arbitrary line width and changing width
to be in world units. <a href="Line2.html">Line2</a> extends this object, forming a polyline instead of individual
segments.</p>
<p>This module can only be used with <a href="WebGLRenderer.html">WebGLRenderer</a>. When using <a href="WebGPURenderer.html">WebGPURenderer</a>,
import the class from <code>lines/webgpu/LineSegments2.js</code>.</p></div>
				<h2>Code Example</h2>
				<div translate="no"><pre><code class="language-js">const geometry = new LineSegmentsGeometry();
geometry.setPositions( positions );
geometry.setColors( colors );
const material = new LineMaterial( { linewidth: 5, vertexColors: true } };
const lineSegments = new LineSegments2( geometry, material );
scene.add( lineSegments );
</code></pre></div>
			</header>
			<article>
				<h2 class="subsection-title">Import</h2>
				<p><span translate="no">LineSegments2</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>
				<pre><code class="language-js">import { LineSegments2 } from 'three/addons/lines/LineSegments2.js';</code></pre>
				<div class="container-overview">
					<h2>Constructor</h2>
					<h3 class="name name-method" id="LineSegments2" translate="no">new <a href="#LineSegments2">LineSegments2</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>
					<div class="method">
						<div class="description">
							<p>Constructs a new wide line.</p>
						</div>
						<table class="params">
							<tbody>
								<tr>
									<td class="name">
										<strong>geometry</strong>
									</td>
									<td class="description last">
										<p>The line geometry.</p>
									</td>
								</tr>
								<tr>
									<td class="name">
										<strong>material</strong>
									</td>
									<td class="description last">
										<p>The line material.</p>
									</td>
								</tr>
							</tbody>
						</table>
					</div>
				</div>
				<h2 class="subsection-title">Properties</h2>
				<div class="member">
					<h3 class="name" id="isLineSegments2" translate="no">.<a href="#isLineSegments2">isLineSegments2</a><span class="type-signature"> : boolean</span> <span class="type-signature">(readonly) </span></h3>
					<div class="description">
						<p>This flag can be used for type testing.</p>
						<p>Default is <code>true</code>.</p>
					</div>
				</div>
				<h2 class="subsection-title">Methods</h2>
					<h3 class="name name-method" id="computeLineDistances" translate="no">.<a href="#computeLineDistances">computeLineDistances</a><span class="signature">()</span><span class="type-signature"> : <a href="LineSegments2.html">LineSegments2</a></span> </h3>
					<div class="method">
						<div class="description">
							<p>Computes an array of distance values which are necessary for rendering dashed lines.
For each vertex in the geometry, the method calculates the cumulative length from the
current point to the very beginning of the line.</p>
						</div>
						<dl class="details">
							<dt class="tag-returns"><strong>Returns:</strong> A reference to this instance.</dt>
						</dl>
					</div>
					<h3 class="name name-method" id="raycast" translate="no">.<a href="#raycast">raycast</a><span class="signature">( raycaster : <span class="param-type"><a href="Raycaster.html">Raycaster</a></span>, intersects : <span class="param-type">Array.&lt;Object></span> )</span> </h3>
					<div class="method">
						<div class="description">
							<p>Computes intersection points between a casted ray and this instance.</p>
						</div>
						<table class="params">
							<tbody>
								<tr>
									<td class="name">
										<strong>raycaster</strong>
									</td>
									<td class="description last">
										<p>The raycaster.</p>
									</td>
								</tr>
								<tr>
									<td class="name">
										<strong>intersects</strong>
									</td>
									<td class="description last">
										<p>The target array that holds the intersection points.</p>
									</td>
								</tr>
							</tbody>
						</table>
						<dl class="details">
							<dt class="tag-overrides"><strong>Overrides:</strong> <a href="Mesh.html#raycast">Mesh#raycast</a></dt>
						</dl>
					</div>
				<h2 class="subsection-title">Source</h2>
				<p>
					<a href="https://github.com/mrdoob/three.js/blob/master/examples/jsm/lines/LineSegments2.js" translate="no" target="_blank" rel="noopener">examples/jsm/lines/LineSegments2.js</a>
				</p>
			</article>
		</section>
<script src="../scripts/linenumber.js"></script>
<script src="../scripts/page.js"></script>
</body>
</html>