EquiangularToCubeGenerator.js 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113
  1. /**
  2. * @author Richard M. / https://github.com/richardmonette
  3. */
  4. THREE.EquiangularToCubeGenerator = function( sourceTexture, resolution ) {
  5. this.sourceTexture = sourceTexture;
  6. this.resolution = resolution;
  7. this.views = [
  8. { t: [1.0, 0.0, 0.0 ], u: [0.0, -1.0, 0.0] },
  9. { t: [-1.0, 0.0, 0.0], u: [0.0, -1.0, 0.0] },
  10. { t: [0.0, 1.0, 0.0], u: [0.0, 0.0, 1.0] },
  11. { t: [0.0, -1.0, 0.0], u: [0.0, 0.0, -1.0] },
  12. { t: [0.0, 0.0, 1.0], u: [0.0, -1.0, 0.0] },
  13. { t: [0.0, 0.0, -1.0], u: [0.0, -1.0, 0.0] },
  14. ];
  15. this.camera = new THREE.PerspectiveCamera( 90, 1, 0.1, 10 );
  16. this.boxMesh = new THREE.Mesh( new THREE.BoxBufferGeometry( 1, 1, 1 ), this.getShader() );
  17. this.boxMesh.material.side = THREE.BackSide;
  18. this.scene = new THREE.Scene();
  19. this.scene.add( this.boxMesh );
  20. };
  21. THREE.EquiangularToCubeGenerator.prototype = {
  22. constructor : THREE.EquiangularToCubeGenerator,
  23. generate: function( renderer ) {
  24. var params = {
  25. format: THREE.RGBAFormat,
  26. magFilter: this.sourceTexture.magFilter,
  27. minFilter: this.sourceTexture.minFilter,
  28. type: this.sourceTexture.type,
  29. generateMipmaps: this.sourceTexture.generateMipmaps,
  30. anisotropy: this.sourceTexture.anisotropy,
  31. encoding: this.sourceTexture.encoding
  32. };
  33. var renderTarget = new THREE.WebGLRenderTargetCube( this.resolution, this.resolution, params );
  34. for ( var i = 0; i < 6; i++ ) {
  35. renderTarget.activeCubeFace = i;
  36. var v = this.views[i];
  37. this.camera.position.set( 0, 0, 0 );
  38. this.camera.up.set( v.u[ 0 ], v.u[ 1 ], v.u[ 2 ] );
  39. this.camera.lookAt( v.t[ 0 ], v.t[ 1 ], v.t[ 2 ] );
  40. this.camera.updateProjectionMatrix();
  41. renderer.render( this.scene, this.camera, renderTarget, true );
  42. }
  43. return renderTarget.texture;
  44. },
  45. getShader: function() {
  46. return new THREE.ShaderMaterial( {
  47. uniforms: {
  48. "equirectangularMap": { value: this.sourceTexture },
  49. },
  50. vertexShader:
  51. "varying vec3 localPosition;\n\
  52. \n\
  53. void main() {\n\
  54. localPosition = position;\n\
  55. gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n\
  56. }",
  57. fragmentShader:
  58. "#include <common>\n\
  59. varying vec3 localPosition;\n\
  60. uniform sampler2D equirectangularMap;\n\
  61. \n\
  62. vec2 EquiangularSampleUV(vec3 v) {\n\
  63. vec2 uv = vec2(atan(v.z, v.x), asin(v.y));\n\
  64. uv *= vec2(0.1591, 0.3183); // inverse atan\n\
  65. uv += 0.5;\n\
  66. return uv;\n\
  67. }\n\
  68. \n\
  69. void main() {\n\
  70. vec2 uv = EquiangularSampleUV(normalize(localPosition));\n\
  71. vec3 color = texture2D(equirectangularMap, uv).rgb;\n\
  72. \n\
  73. gl_FragColor = vec4( color, 1.0 );\n\
  74. }",
  75. blending: THREE.CustomBlending,
  76. premultipliedAlpha: false,
  77. blendSrc: THREE.OneFactor,
  78. blendDst: THREE.ZeroFactor,
  79. blendSrcAlpha: THREE.OneFactor,
  80. blendDstAlpha: THREE.ZeroFactor,
  81. blendEquation: THREE.AddEquation
  82. } );
  83. }
  84. };