VideoTexture.html 3.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8" />
  5. <base href="../../../" />
  6. <script src="page.js"></script>
  7. <link type="text/css" rel="stylesheet" href="page.css" />
  8. </head>
  9. <body>
  10. [page:Texture] &rarr;
  11. <h1>[name]</h1>
  12. <p class="desc">
  13. Creates a texture for use with a video texture.<br /><br />
  14. This is almost the same as the base [page:Texture Texture] class, except that it continuosly sets [page:Texture.needsUpdate needsUpdate] to *true* so that the texture is updated as the video plays. Automatic creation of [page:Texture.mipmaps mipmaps] is also disabled.
  15. </p>
  16. <h2>Code Example</h2>
  17. <code>
  18. // assuming you have created a HTML video element with id="video"
  19. const video = document.getElementById( 'video' );
  20. const texture = new THREE.VideoTexture( video );
  21. </code>
  22. <h2>Examples</h2>
  23. <p>[example:webgl_materials_video materials / video ]</p>
  24. <h2>Constructor</h2>
  25. <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>
  26. <p>
  27. [page:Video video] -- The video element to use as the texture. <br />
  28. [page:Constant mapping] -- How the image is applied to the object. An object type of [page:Textures THREE.UVMapping].
  29. See [page:Textures mapping constants] for other choices.<br />
  30. [page:Constant wrapS] -- The default is [page:Textures THREE.ClampToEdgeWrapping].
  31. See [page:Textures wrap mode constants] for other choices.<br />
  32. [page:Constant wrapT] -- The default is [page:Textures THREE.ClampToEdgeWrapping].
  33. See [page:Textures wrap mode constants] for other choices.<br />
  34. [page:Constant magFilter] -- How the texture is sampled when a texel covers more than one pixel.
  35. The default is [page:Textures THREE.LinearFilter]. See [page:Textures magnification filter constants] for other choices.<br />
  36. [page:Constant minFilter] -- How the texture is sampled when a texel covers less than one pixel.
  37. The default is [page:Textures THREE.LinearMipmapLinearFilter]. See [page:Textures minification filter constants] for other choices.<br />
  38. [page:Constant format] -- The format used in the texture.
  39. See [page:Textures format constants] for other choices.<br />
  40. [page:Constant type] -- Default is [page:Textures THREE.UnsignedByteType].
  41. See [page:Textures type constants] for other choices.<br />
  42. [page:Number anisotropy] -- The number of samples taken along the axis through the pixel that has the highest density of texels.
  43. 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.
  44. 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 />
  45. </p>
  46. <h2>Properties</h2>
  47. <p>
  48. See the base [page:Texture Texture] class for common properties.
  49. </p>
  50. <h3>[property:Boolean needsUpdate]</h3>
  51. <p>
  52. You will not need to set this manually here as it is handled by the [page:VideoTexture.update update] method.
  53. </p>
  54. <h2>Methods</h2>
  55. <p>
  56. See the base [page:Texture Texture] class for common methods.
  57. </p>
  58. <h3>[method:null update]()</h3>
  59. <p>
  60. This is called automatically and sets [property:Boolean needsUpdate] to *true* every time
  61. a new frame is available.
  62. </p>
  63. <h2>Source</h2>
  64. <p>
  65. [link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
  66. </p>
  67. </body>
  68. </html>