Texture.html 7.1 KB
Newer Older
M
r66  
Mr.doob 已提交
1 2 3
<!DOCTYPE html>
<html lang="en">
	<head>
M
r72  
Mr.doob 已提交
4 5 6 7 8
		<meta charset="utf-8" />
		<base href="../../" />
		<script src="list.js"></script>
		<script src="page.js"></script>
		<link type="text/css" rel="stylesheet" href="page.css" />
M
r66  
Mr.doob 已提交
9 10 11 12 13 14 15 16 17 18 19 20 21 22 23
	</head>
	<body>
		<h1>[name]</h1>

		<div class="desc">Create a texture to apply to a surface or as a reflection or refraction map.</div>


		<h2>Constructor</h2>

		<h3>[name]( image, mapping, wrapS, wrapT, magFilter, minFilter, format, type, anisotropy )</h3>

		<h2>Example</h2>

		<code>
		// load a texture, set wrap mode to repeat
M
r74  
Mr.doob 已提交
24
		var texture = new THREE.TextureLoader().load( "textures/water.jpg" );
M
r66  
Mr.doob 已提交
25 26 27 28 29 30 31
		texture.wrapS = THREE.RepeatWrapping;
		texture.wrapT = THREE.RepeatWrapping;
		texture.repeat.set( 4, 4 );
		</code>

		<h2>Properties</h2>

M
r69  
Mr.doob 已提交
32 33 34 35 36 37
		<h3>[property:Integer id]</h3>
		<div>
		Unique number for this texture instance.
		</div>

		<h3>[property:Image image]</h3>
M
r66  
Mr.doob 已提交
38 39 40 41
		<div>
		An Image object, typically created using the ImageUtils or [page:ImageLoader ImageLoader] classes. The Image object can include an image (e.g., PNG, JPG, GIF, DDS), video (e.g., MP4, OGG/OGV), or set of six images for a cube map. To use video as a texture you need to have a playing HTML5 video element as a source for your texture image and continuously update this texture as long as video is playing.
		</div>

M
r69  
Mr.doob 已提交
42
		<h3>[property:object mapping]</h3>
M
r66  
Mr.doob 已提交
43
		<div>
M
r70  
Mr.doob 已提交
44
		How the image is applied to the object. An object type of THREE.UVMapping is the default, where the U,V coordinates are used to apply the map, and a single texture is expected. The other types are THREE.CubeReflectionMapping, for cube maps used as a reflection map; THREE.CubeRefractionMapping, refraction mapping; and THREE.SphericalReflectionMapping, a spherical reflection map projection.
M
r66  
Mr.doob 已提交
45 46
		</div>

M
r69  
Mr.doob 已提交
47
		<h3>[property:number wrapS]</h3>
M
r66  
Mr.doob 已提交
48 49 50 51
		<div>
		The default is THREE.ClampToEdgeWrapping, where the edge is clamped to the outer edge texels. The other two choices are THREE.RepeatWrapping and THREE.MirroredRepeatWrapping.
		</div>

M
r69  
Mr.doob 已提交
52
		<h3>[property:number wrapT]</h3>
M
r66  
Mr.doob 已提交
53 54 55
		<div>
		The default is THREE.ClampToEdgeWrapping, where the edge is clamped to the outer edge texels. The other two choices are THREE.RepeatWrapping and THREE.MirroredRepeatWrapping.
		</div>
M
r74  
Mr.doob 已提交
56

M
r70  
Mr.doob 已提交
57 58 59
		<div>
		NOTE: tiling of images in textures only functions if image dimensions are powers of two (2, 4, 8, 16, 32, 64, 128, 256, 512, 1024, 2048, ...) in terms of pixels. Individual dimensions need not be equal, but each must be a power of two. This is a limitation of WebGL, not Three.js.
		</div>
M
r66  
Mr.doob 已提交
60

M
r69  
Mr.doob 已提交
61
		<h3>[property:number magFilter]</h3>
M
r66  
Mr.doob 已提交
62 63 64 65
		<div>
		How the texture is sampled when a texel covers more than one pixel. The default is THREE.LinearFilter, which takes the four closest texels and bilinearly interpolates among them. The other option is THREE.NearestFilter, which uses the value of the closest texel.
		</div>

M
r69  
Mr.doob 已提交
66
		<h3>[property:number minFilter]</h3>
M
r66  
Mr.doob 已提交
67 68 69 70
		<div>
		How the texture is sampled when a texel covers less than one pixel. The default is THREE.LinearMipMapLinearFilter, which uses mipmapping and a trilinear filter. Other choices are THREE.NearestFilter, THREE.NearestMipMapNearestFilter, THREE.NearestMipMapLinearFilter, THREE.LinearFilter, and THREE.LinearMipMapNearestFilter. These vary whether the nearest texel or nearest four texels are retrieved on the nearest mipmap or nearest two mipmaps. Interpolation occurs among the samples retrieved.
		</div>

M
r69  
Mr.doob 已提交
71
		<h3>[property:number format]</h3>
M
r66  
Mr.doob 已提交
72 73 74 75
		<div>
		The default is THREE.RGBAFormat for the texture. Other formats are: THREE.AlphaFormat, THREE.RGBFormat, THREE.LuminanceFormat, and THREE.LuminanceAlphaFormat. There are also compressed texture formats, if the S3TC extension is supported: THREE.RGB_S3TC_DXT1_Format, THREE.RGBA_S3TC_DXT1_Format, THREE.RGBA_S3TC_DXT3_Format, and THREE.RGBA_S3TC_DXT5_Format.
		</div>

M
r69  
Mr.doob 已提交
76
		<h3>[property:number type]</h3>
M
r66  
Mr.doob 已提交
77 78 79 80
		<div>
		The default is THREE.UnsignedByteType. Other valid types (as WebGL allows) are THREE.ByteType, THREE.ShortType, THREE.UnsignedShortType, THREE.IntType, THREE.UnsignedIntType, THREE.FloatType, THREE.UnsignedShort4444Type, THREE.UnsignedShort5551Type, and THREE.UnsignedShort565Type.
		</div>

M
r69  
Mr.doob 已提交
81
		<h3>[property:number anisotropy]</h3>
M
r66  
Mr.doob 已提交
82 83 84 85
		<div>
		The number of samples taken along the axis through the pixel that has the highest density of texels. By default, this value is 1. A higher value gives a less blurry result than a basic mipmap, at the cost of more texture samples being used. Use renderer.getMaxAnisotropy() to find the maximum valid anisotropy value for the GPU; this value is usually a power of 2.
		</div>

M
r69  
Mr.doob 已提交
86
		<h3>[property:boolean needsUpdate]</h3>
M
r66  
Mr.doob 已提交
87 88 89 90
		<div>
		If a texture is changed after creation, set this flag to true so that the texture is properly set up. Particularly important for setting the wrap mode.
		</div>

M
r69  
Mr.doob 已提交
91
		<h3>[property:Vector2 repeat]</h3>
M
r66  
Mr.doob 已提交
92 93 94 95
		<div>
		How many times the texture is repeated across the surface, in each direction U and V.
		</div>

M
r69  
Mr.doob 已提交
96
		<h3>[property:Vector2 offset]</h3>
M
r66  
Mr.doob 已提交
97 98 99 100
		<div>
		How much a single repetition of the texture is offset from the beginning, in each direction U and V. Typical range is 0.0 to 1.0.
		</div>

M
r69  
Mr.doob 已提交
101
		<h3>[property:string name]</h3>
M
r66  
Mr.doob 已提交
102 103 104 105
		<div>
		Given name of the texture, empty string by default.
		</div>

M
r69  
Mr.doob 已提交
106
		<h3>[property:boolean generateMipmaps]</h3>
M
r66  
Mr.doob 已提交
107 108 109 110
		<div>
		Whether to generate mipmaps (if possible) for a texture. True by default.
		</div>

M
r69  
Mr.doob 已提交
111
		<h3>[property:boolean flipY]</h3>
M
r66  
Mr.doob 已提交
112
		<div>
M
r70  
Mr.doob 已提交
113
		True by default. Flips the image's Y axis to match the WebGL texture coordinate space.
M
r66  
Mr.doob 已提交
114 115
		</div>

M
r69  
Mr.doob 已提交
116
		<h3>[property:array mipmaps]</h3>
M
r66  
Mr.doob 已提交
117 118 119 120
		<div>
		Array of mipmaps generated.
		</div>

M
r69  
Mr.doob 已提交
121
		<h3>[property:number unpackAlignment]</h3>
M
r66  
Mr.doob 已提交
122 123 124 125
		<div>
		4 by default. Specifies the alignment requirements for the start of each pixel row in memory. The allowable values are 1 (byte-alignment), 2 (rows aligned to even-numbered bytes), 4 (word-alignment), and 8 (rows start on double-word boundaries). See <a href="http://www.khronos.org/opengles/sdk/docs/man/xhtml/glPixelStorei.xml">glPixelStorei</a> for more information.
		</div>

M
r69  
Mr.doob 已提交
126
		<h3>[property:boolean premultiplyAlpha]</h3>
M
r66  
Mr.doob 已提交
127 128 129 130
		<div>
		False by default, which is the norm for PNG images. Set to true if the RGB values have been stored premultiplied by alpha.
		</div>

M
r76  
Mr.doob 已提交
131 132 133 134 135
		<h3>[property:number encoding]</h3>
		<div>
		Set to THREE.LinearEncoding by default, but supports sRGB, RGBE, RGBM, RGBD, LogLuv and Gamma corrected encodings.  IMPORTANT: If this value is changed on a texture after the material has been used, it is necessary to trigger a Material.needsUpdate for this value to be realized in the shader.
		</div>

M
r69  
Mr.doob 已提交
136
		<h3>[property:object onUpdate]</h3>
M
r66  
Mr.doob 已提交
137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160
		<div>
		A callback function, called when the texture is updated (e.g., when needsUpdate has been set to true and then the texture is used).
		</div>


		<h2>Methods</h2>

		<h3>[page:EventDispatcher EventDispatcher] methods are available on this class.</h3>

		<h3>.clone([page:Texture texture])</h3>
		<div>
		Make copy of texture. Note this is not a "deep copy", the image is shared.
		</div>

		<h3>.dispose()</h3>
		<div>
		Call [page:EventDispatcher EventDispatcher].dispatchEvent with a 'dispose' event type.
		</div>

		<h2>Source</h2>

		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
	</body>
</html>