CombinedCamera.js 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230
  1. /**
  2. * @author zz85 / http://twitter.com/blurspline / http://www.lab4games.net/zz85/blog
  3. *
  4. * A general perpose camera, for setting FOV, Lens Focal Length,
  5. * and switching between perspective and orthographic views easily.
  6. * Use this only if you do not wish to manage
  7. * both a Orthographic and Perspective Camera
  8. *
  9. */
  10. THREE.CombinedCamera = function ( width, height, fov, near, far, orthoNear, orthoFar ) {
  11. THREE.Camera.call( this );
  12. this.fov = fov;
  13. this.left = - width / 2;
  14. this.right = width / 2;
  15. this.top = height / 2;
  16. this.bottom = - height / 2;
  17. // We could also handle the projectionMatrix internally, but just wanted to test nested camera objects
  18. this.cameraO = new THREE.OrthographicCamera( width / - 2, width / 2, height / 2, height / - 2, orthoNear, orthoFar );
  19. this.cameraP = new THREE.PerspectiveCamera( fov, width / height, near, far );
  20. this.zoom = 1;
  21. this.toPerspective();
  22. };
  23. THREE.CombinedCamera.prototype = Object.create( THREE.Camera.prototype );
  24. THREE.CombinedCamera.prototype.constructor = THREE.CombinedCamera;
  25. THREE.CombinedCamera.prototype.toPerspective = function () {
  26. // Switches to the Perspective Camera
  27. this.near = this.cameraP.near;
  28. this.far = this.cameraP.far;
  29. this.cameraP.fov = this.fov / this.zoom ;
  30. this.cameraP.updateProjectionMatrix();
  31. this.projectionMatrix = this.cameraP.projectionMatrix;
  32. this.inPerspectiveMode = true;
  33. this.inOrthographicMode = false;
  34. };
  35. THREE.CombinedCamera.prototype.toOrthographic = function () {
  36. // Switches to the Orthographic camera estimating viewport from Perspective
  37. var fov = this.fov;
  38. var aspect = this.cameraP.aspect;
  39. var near = this.cameraP.near;
  40. var far = this.cameraP.far;
  41. // The size that we set is the mid plane of the viewing frustum
  42. var hyperfocus = ( near + far ) / 2;
  43. var halfHeight = Math.tan( fov * Math.PI / 180 / 2 ) * hyperfocus;
  44. var halfWidth = halfHeight * aspect;
  45. halfHeight /= this.zoom;
  46. halfWidth /= this.zoom;
  47. this.cameraO.left = - halfWidth;
  48. this.cameraO.right = halfWidth;
  49. this.cameraO.top = halfHeight;
  50. this.cameraO.bottom = - halfHeight;
  51. // this.cameraO.left = -farHalfWidth;
  52. // this.cameraO.right = farHalfWidth;
  53. // this.cameraO.top = farHalfHeight;
  54. // this.cameraO.bottom = -farHalfHeight;
  55. // this.cameraO.left = this.left / this.zoom;
  56. // this.cameraO.right = this.right / this.zoom;
  57. // this.cameraO.top = this.top / this.zoom;
  58. // this.cameraO.bottom = this.bottom / this.zoom;
  59. this.cameraO.updateProjectionMatrix();
  60. this.near = this.cameraO.near;
  61. this.far = this.cameraO.far;
  62. this.projectionMatrix = this.cameraO.projectionMatrix;
  63. this.inPerspectiveMode = false;
  64. this.inOrthographicMode = true;
  65. };
  66. THREE.CombinedCamera.prototype.setSize = function( width, height ) {
  67. this.cameraP.aspect = width / height;
  68. this.left = - width / 2;
  69. this.right = width / 2;
  70. this.top = height / 2;
  71. this.bottom = - height / 2;
  72. };
  73. THREE.CombinedCamera.prototype.setFov = function( fov ) {
  74. this.fov = fov;
  75. if ( this.inPerspectiveMode ) {
  76. this.toPerspective();
  77. } else {
  78. this.toOrthographic();
  79. }
  80. };
  81. // For maintaining similar API with PerspectiveCamera
  82. THREE.CombinedCamera.prototype.updateProjectionMatrix = function() {
  83. if ( this.inPerspectiveMode ) {
  84. this.toPerspective();
  85. } else {
  86. this.toPerspective();
  87. this.toOrthographic();
  88. }
  89. };
  90. /*
  91. * Uses Focal Length (in mm) to estimate and set FOV
  92. * 35mm (full frame) camera is used if frame size is not specified;
  93. * Formula based on http://www.bobatkins.com/photography/technical/field_of_view.html
  94. */
  95. THREE.CombinedCamera.prototype.setLens = function ( focalLength, filmGauge ) {
  96. if ( filmGauge === undefined ) filmGauge = 35;
  97. var vExtentSlope = 0.5 * filmGauge /
  98. ( focalLength * Math.max( this.cameraP.aspect, 1 ) );
  99. var fov = THREE.Math.RAD2DEG * 2 * Math.atan( vExtentSlope );
  100. this.setFov( fov );
  101. return fov;
  102. };
  103. THREE.CombinedCamera.prototype.setZoom = function( zoom ) {
  104. this.zoom = zoom;
  105. if ( this.inPerspectiveMode ) {
  106. this.toPerspective();
  107. } else {
  108. this.toOrthographic();
  109. }
  110. };
  111. THREE.CombinedCamera.prototype.toFrontView = function() {
  112. this.rotation.x = 0;
  113. this.rotation.y = 0;
  114. this.rotation.z = 0;
  115. // should we be modifing the matrix instead?
  116. };
  117. THREE.CombinedCamera.prototype.toBackView = function() {
  118. this.rotation.x = 0;
  119. this.rotation.y = Math.PI;
  120. this.rotation.z = 0;
  121. };
  122. THREE.CombinedCamera.prototype.toLeftView = function() {
  123. this.rotation.x = 0;
  124. this.rotation.y = - Math.PI / 2;
  125. this.rotation.z = 0;
  126. };
  127. THREE.CombinedCamera.prototype.toRightView = function() {
  128. this.rotation.x = 0;
  129. this.rotation.y = Math.PI / 2;
  130. this.rotation.z = 0;
  131. };
  132. THREE.CombinedCamera.prototype.toTopView = function() {
  133. this.rotation.x = - Math.PI / 2;
  134. this.rotation.y = 0;
  135. this.rotation.z = 0;
  136. };
  137. THREE.CombinedCamera.prototype.toBottomView = function() {
  138. this.rotation.x = Math.PI / 2;
  139. this.rotation.y = 0;
  140. this.rotation.z = 0;
  141. };