Camera插件之CinematicCamera
继承自PerspectiveCame
构造函数引用的PerspectiveCamera的构造函数, 代码如下
var CinematicCamera = function ( fov, aspect, near, far ) { PerspectiveCamera.call( this, fov, aspect, near, far ); ... }那么说到底, CinematicCamera还是PerspectiveCamera!!!
效果演示
有没有发现其中的奥秘呢?
这种相机可以设置焦点哦, 突出想要关注的地方, 其他地方比较模糊
1. 属性介绍 属性名: 类型 功能 默认值type : 字符串 描述信息 'CinematicCamera'
postprocessing : 对象 对相机的全部设置 { enabled: true }
shaderSettings : 对象 渲染设置, 最后应用在postprocessing { rings: 3, samples: 4 }
depthShader : 未知 组成ShaderMaterial给materialDepth BokehDepthShader
materialDepth : ShaderMaterial 赋予了scene.overrideMaterial
materialDepth
this.materialDepth = new ShaderMaterial( { uniforms: depthShader.uniforms, vertexShader: depthShader.vertexShader, fragmentShader: depthShader.fragmentShader } ) this.materialDepth.uniforms[ 'mNear' ].value = near; this.materialDepth.uniforms[ 'mFar' ].value = far; scene.overrideMaterial = this.materialDepth; 2. 方法介绍 方法名: 返回类型 功能 具体内容类方法 : setLens( focalLength, filmGauge, fNumber, coc )
类方法 : linearize( depth )
类方法 : smoothstep( near, far, depth )
类方法 : saturate( x )
类方法 : focusAt( focusDistance )
类方法 : initPostProcessing()
类方法 : renderCinematic( scene, renderer )
3. 方法详情
setLens
function ( focalLength, filmGauge, fNumber, coc ) { // In case of cinematicCamera, having a default lens set is important if ( focalLength === undefined ) focalLength = 35; if ( filmGauge !== undefined ) this.filmGauge = filmGauge; this.setFocalLength( focalLength ); // if fnumber and coc are not provided, cinematicCamera tries to act as a basic PerspectiveCamera if ( fNumber === undefined ) fNumber = 8; if ( coc === undefined ) coc = 0.019; this.fNumber = fNumber; this.coc = coc; // fNumber is focalLength by aperture this.aperture = focalLength / this.fNumber; // hyperFocal is required to calculate depthOfField when a lens tries to focus at a distance with given fNumber and focalLength this.hyperFocal = ( focalLength * focalLength ) / ( this.aperture * this.coc ); };linearize
function ( depth ) { var zfar = this.far; var znear = this.near; return - zfar * znear / ( depth * ( zfar - znear ) - zfar ); };smoothstep
function ( near, far, depth ) { var x = this.saturate( ( depth - near ) / ( far - near ) ); return x * x * ( 3 - 2 * x ); };saturate
function ( x ) { return Math.max( 0, Math.min( 1, x ) ); }focusAt
function ( focusDistance ) { if ( focusDistance === undefined ) focusDistance = 20; var focalLength = this.getFocalLength(); // distance from the camera (normal to frustrum) to focus on this.focus = focusDistance; // the nearest point from the camera which is in focus (unused) this.nearPoint = ( this.hyperFocal * this.focus ) / ( this.hyperFocal + ( this.focus - focalLength ) ); // the farthest point from the camera which is in focus (unused) this.farPoint = ( this.hyperFocal * this.focus ) / ( this.hyperFocal - ( this.focus - focalLength ) ); // the gap or width of the space in which is everything is in focus (unused) this.depthOfField = this.farPoint - this.nearPoint; // Considering minimum distance of focus for a standard lens (unused) if ( this.depthOfField < 0 ) this.depthOfField = 0; this.sdistance = this.smoothstep( this.near, this.far, this.focus ); this.ldistance = this.linearize( 1 - this.sdistance ); this.postprocessing.bokeh_uniforms[ 'focalDepth' ].value = this.ldistance; };