samien
/
three.js
mirror of https://github.com/mrdoob/three.js.git


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
							<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>PointsMaterial - 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="Material.html">Material</a> → </p>
	<h1 translate="no">PointsMaterial</h1>
		<section>
			<header>
				<div class="class-description"><p>A material for rendering point primitives.</p>
<p>Materials define the appearance of renderable 3D objects.</p></div>
				<h2>Code Example</h2>
				<div translate="no"><pre><code class="language-js">const vertices = [];
for ( let i = 0; i &lt; 10000; i ++ ) {
	const x = THREE.MathUtils.randFloatSpread( 2000 );
	const y = THREE.MathUtils.randFloatSpread( 2000 );
	const z = THREE.MathUtils.randFloatSpread( 2000 );
	vertices.push( x, y, z );
}
const geometry = new THREE.BufferGeometry();
geometry.setAttribute( 'position', new THREE.Float32BufferAttribute( vertices, 3 ) );
const material = new THREE.PointsMaterial( { color: 0x888888 } );
const points = new THREE.Points( geometry, material );
scene.add( points );
</code></pre></div>
			</header>
			<article>
				<div class="container-overview">
					<h2>Constructor</h2>
					<h3 class="name name-method" id="PointsMaterial" translate="no">new <a href="#PointsMaterial">PointsMaterial</a><span class="signature">( parameters : <span class="param-type">Object</span> )</span> </h3>
					<div class="method">
						<div class="description">
							<p>Constructs a new points material.</p>
						</div>
						<table class="params">
							<tbody>
								<tr>
									<td class="name"><code>parameters</code></td>
									<td class="description last"><p>An object with one or more properties
defining the material's appearance. Any property of the material
(including any property from inherited materials) can be passed
in here. Color values can be passed any type of value accepted
by <a href="Color.html#set">Color#set</a>.</p></td>
								</tr>
							</tbody>
						</table>
					</div>
				</div>
				<h2 class="subsection-title">Properties</h2>
				<div class="member">
					<h3 class="name" id="alphaMap" translate="no">.<a href="#alphaMap">alphaMap</a><span class="type-signature"> : <a href="Texture.html">Texture</a></span> </h3>
					<div class="description">
						<p>The alpha map is a grayscale texture that controls the opacity across the
surface (black: fully transparent; white: fully opaque).</p>
<p>Only the color of the texture is used, ignoring the alpha channel if one
exists. For RGB and RGBA textures, the renderer will use the green channel
when sampling this texture due to the extra bit of precision provided for
green in DXT-compressed and uncompressed RGB 565 formats. Luminance-only and
luminance/alpha textures will also still work as expected.<br/>Default is <code>null</code>.</p>
					</div>
				</div>
				<div class="member">
					<h3 class="name" id="color" translate="no">.<a href="#color">color</a><span class="type-signature"> : <a href="Color.html">Color</a></span> </h3>
					<div class="description">
						<p>Color of the material.<br/>Default is <code>(1,1,1)</code>.</p>
					</div>
				</div>
				<div class="member">
					<h3 class="name" id="fog" translate="no">.<a href="#fog">fog</a><span class="type-signature"> : boolean</span> </h3>
					<div class="description">
						<p>Whether the material is affected by fog or not.<br/>Default is <code>true</code>.</p>
					</div>
				</div>
				<div class="member">
					<h3 class="name" id="isPointsMaterial" translate="no">.<a href="#isPointsMaterial">isPointsMaterial</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.<br/>Default is <code>true</code>.</p>
					</div>
				</div>
				<div class="member">
					<h3 class="name" id="map" translate="no">.<a href="#map">map</a><span class="type-signature"> : <a href="Texture.html">Texture</a></span> </h3>
					<div class="description">
						<p>The color map. May optionally include an alpha channel, typically combined
with <a href="Material.html#transparent">Material#transparent</a> or <a href="Material.html#alphaTest">Material#alphaTest</a>. The texture map
color is modulated by the diffuse <code>color</code>.<br/>Default is <code>null</code>.</p>
					</div>
				</div>
				<div class="member">
					<h3 class="name" id="size" translate="no">.<a href="#size">size</a><span class="type-signature"> : number</span> </h3>
					<div class="description">
						<p>Defines the size of the points in pixels.</p>
<p>Might be capped if the value exceeds hardware dependent parameters like <a href="https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/getParamete">gl.ALIASED_POINT_SIZE_RANGE</a>.<br/>Default is <code>1</code>.</p>
					</div>
				</div>
				<div class="member">
					<h3 class="name" id="sizeAttenuation" translate="no">.<a href="#sizeAttenuation">sizeAttenuation</a><span class="type-signature"> : boolean</span> </h3>
					<div class="description">
						<p>Specifies whether size of individual points is attenuated by the camera depth (perspective camera only).<br/>Default is <code>true</code>.</p>
					</div>
				</div>
				<h2 class="subsection-title">Source</h2>
				<p>
					<a href="https://github.com/mrdoob/three.js/blob/master/src/materials/PointsMaterial.js" target="_blank" rel="noopener" translate="no">src/materials/PointsMaterial.js</a>
				</p>
			</article>
		</section>
<script src="../scripts/linenumber.js"></script>
<script src="../scripts/page.js"></script>
</body>
</html>