You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
113 lines
3.9 KiB
113 lines
3.9 KiB
2 years ago
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8" />
|
||
|
|
<base href="../../../" />
|
||
|
|
<script src="page.js"></script>
|
||
|
|
<link type="text/css" rel="stylesheet" href="page.css" />
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
[page:Texture] →
|
||
|
|
|
||
|
|
<h1>[name]</h1>
|
||
|
|
|
||
|
|
<p class="desc">
|
||
|
|
Creates a texture for use with a video.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<p>
|
||
|
|
Note: After the initial use of a texture, the video cannot be changed. Instead, call [page:.dispose]() on the texture and instantiate a new one.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<h2>Code Example</h2>
|
||
|
|
|
||
|
|
<code>
|
||
|
|
// assuming you have created a HTML video element with id="video"
|
||
|
|
const video = document.getElementById( 'video' );
|
||
|
|
const texture = new THREE.VideoTexture( video );
|
||
|
|
</code>
|
||
|
|
|
||
|
|
<h2>Examples</h2>
|
||
|
|
|
||
|
|
<p>
|
||
|
|
[example:webgl_materials_video materials / video]<br />
|
||
|
|
[example:webgl_materials_video_webcam materials / video / webcam]<br />
|
||
|
|
[example:webgl_video_kinect video / kinect]<br />
|
||
|
|
[example:webgl_video_panorama_equirectangular video / panorama / equirectangular]<br />
|
||
|
|
[example:webxr_vr_video vr / video]
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<h2>Constructor</h2>
|
||
|
|
<h3>[name]( [param:Video video], [param:Constant mapping], [param:Constant wrapS], [param:Constant wrapT], [param:Constant magFilter], [param:Constant minFilter], [param:Constant format], [param:Constant type], [param:Number anisotropy] )</h3>
|
||
|
|
<p>
|
||
|
|
[page:Video video] -- The video element to use as the texture. <br />
|
||
|
|
|
||
|
|
[page:Constant mapping] -- How the image is applied to the object. An object type of [page:Textures THREE.UVMapping].
|
||
|
|
See [page:Textures mapping constants] for other choices.<br />
|
||
|
|
|
||
|
|
[page:Constant wrapS] -- The default is [page:Textures THREE.ClampToEdgeWrapping].
|
||
|
|
See [page:Textures wrap mode constants] for other choices.<br />
|
||
|
|
|
||
|
|
[page:Constant wrapT] -- The default is [page:Textures THREE.ClampToEdgeWrapping].
|
||
|
|
See [page:Textures wrap mode constants] for other choices.<br />
|
||
|
|
|
||
|
|
[page:Constant magFilter] -- How the texture is sampled when a texel covers more than one pixel.
|
||
|
|
The default is [page:Textures THREE.LinearFilter]. See [page:Textures magnification filter constants] for other choices.<br />
|
||
|
|
|
||
|
|
[page:Constant minFilter] -- How the texture is sampled when a texel covers less than one pixel.
|
||
|
|
The default is [page:Textures THREE.LinearFilter]. See [page:Textures minification filter constants] for other choices.<br />
|
||
|
|
|
||
|
|
[page:Constant format] -- The default is [page:Textures THREE.RGBAFormat].
|
||
|
|
See [page:Textures format constants] for other choices.<br />
|
||
|
|
|
||
|
|
[page:Constant type] -- Default is [page:Textures THREE.UnsignedByteType].
|
||
|
|
See [page:Textures type constants] for other choices.<br />
|
||
|
|
|
||
|
|
[page:Number anisotropy] -- 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 [page:WebGLrenderer.getMaxAnisotropy renderer.getMaxAnisotropy]() to find the maximum valid anisotropy value for the GPU; this value is usually a power of 2.<br /><br />
|
||
|
|
</p>
|
||
|
|
|
||
|
|
|
||
|
|
<h2>Properties</h2>
|
||
|
|
|
||
|
|
<p>
|
||
|
|
See the base [page:Texture Texture] class for common properties.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<h3>[property:Boolean generateMipmaps]</h3>
|
||
|
|
<p>
|
||
|
|
Whether to generate mipmaps. `false` by default.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<h3>[property:Boolean isVideoTexture]</h3>
|
||
|
|
<p>
|
||
|
|
Read-only flag to check if a given object is of type [name].
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<h3>[property:Boolean needsUpdate]</h3>
|
||
|
|
<p>
|
||
|
|
You will not need to set this manually here as it is handled by the [page:VideoTexture.update update]() method.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<h2>Methods</h2>
|
||
|
|
|
||
|
|
<p>
|
||
|
|
See the base [page:Texture Texture] class for common methods.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<h3>[method:undefined update]()</h3>
|
||
|
|
<p>
|
||
|
|
This is called automatically and sets [page:VideoTexture.needsUpdate .needsUpdate] to `true` every time
|
||
|
|
a new frame is available.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
|
||
|
|
<h2>Source</h2>
|
||
|
|
|
||
|
|
<p>
|
||
|
|
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
|
||
|
|
</p>
|
||
|
|
</body>
|
||
|
|
</html>
|