一、react-three/postprocessing--處理效果的庫

簡而言之：包裝效果 該庫提供了一個 EffectPass，可自動組織和合并任何給定的效果組合。這最大限度地減少了渲染操作的數(shù)量，并且可以組合許多效果，而不會受到傳統(tǒng)傳遞鏈接的性能損失。此外，每個效果都可以選擇自己的混合功能。 后處理還支持開箱即用的 srgb 編碼，以及 WebGL2 MSAA（多樣本抗鋸齒），這是 react-postprocessing 的默認設置，您可以獲得高性能的清晰結果，而不會出現(xiàn)鋸齒狀邊緣。

二、提供的組件

<EffectComposer>//...//</EffectComposer>

效果處理器，包裹添加的效果組件，比如光照效果Light 景深組件等等

參數(shù)：

<EffectComposer
  enabled?: boolean
  children: JSX.Element | JSX.Element[]
  depthBuffer?: boolean  /** 深度緩沖區(qū) 。深度緩沖區(qū)記錄著屏幕對應的每個像素的深度值。
通過深度緩沖區(qū)，可以進行深度測試，從而確定像素的遮擋關系，保證渲染正確。這是深度緩沖最主要的作用。*/
  disableNormalPass?: boolean  /**是否禁用NormalPass，NormalPass可以在已經(jīng)渲染出來的影像中中創(chuàng)建模擬反射環(huán)境光的效果 */
  stencilBuffer?: boolean //模板緩沖區(qū)
  autoClear?: boolean //自動clear
  multisampling?: number
  frameBufferType?: TextureDataType
  /** For effects that support DepthDownsamplingPass */
  resolutionScale?: number //分辨率尺cun
  renderPriority?: number  //渲染優(yōu)先級
  camera?: THREE.Camera
  scene?: THREE.Scene
>

<DepthOfField />景深效果組件

作用："景深"是指當焦距對準某一點時，其前后都仍可清晰的范圍。拍照時景深越大，景深范圍內所有畫面的輪廓依然清晰，從近到遠全部清晰，相反景深值小了清晰的單位就小，前景背景是模糊的 貼兩個對比圖

參數(shù)

官網(wǎng)示例：<DepthOfField focusDistance={0} focalLength={0.02} bokehScale={2} height={480} />

• focusDistance:對焦距離
• focalLength: 焦距 ，關于對焦距離和焦距的區(qū)別看文末補充介紹就好
• bokehScale: 虛化比例
• height :高度
• width:寬度
• blur：number：模糊度
• depthTexture:{texture: Texture; packing: number;};：紋理

<Bloom /> 光暈效果組件

參數(shù)

官網(wǎng)示例 <Bloom luminanceThreshold={0} luminanceSmoothing={0.9} height={300} />

• luminanceThreshold： 亮度閾值 默認0.9 在[0,1]之間取值
• luminanceSmoothing：亮度平滑 默認00.025 在[0,1]之間取值
• height：高度
• width: 寬度
• intensity: 強度 默認是 1
• kernelSize: 內核大小 一般用不上
• opacity: 不透明度，指定了一個元素后面的背景的被覆蓋程度。

<Noise /> 噪點效果組件

官網(wǎng)示例 <Noise opacity={0.02} />

作用：類似于“顆粒”效果，俗話說給一個圖片降噪，就是設置這個組件并添加參數(shù)值 參數(shù)

• premultiply：boolean 默認false 噪點的預乘功能 噪聲是否應與輸入顏色相乘。 比如有了亮度 設置它為true，圖片會更亮
• opacity: 不透明度，指定了一個元素后面的背景的被覆蓋程度。

<Vignette /> 暈影，虛化效果組件

官網(wǎng)示例

Vignette eskil={false} offset={0.1} darkness={1.1} />

參數(shù)

• eskil Boolean 默認false 如果offset值大于1，那么這里必須設置為true，不然圖片可能會有個黑洞
• blendFunction BlendFunction 默認BlendFunction.NORMAL.
• offset Number 默認0.5 偏移量
• darkness Number 默認0.5 好比一個圖片，設置了虛化，這個值越大，圖片的四個角的黑色越大

<ToneMapping/> 一種色調映射效果組件

示例及參數(shù)：

<ToneMapping
    //blendFunction={BlendFunction.NORMAL} // blend mode
    adaptive={true} // 切換自適應亮度圖用法 默認為true
    resolution={256} // texture 亮度的分辨率。默認256。
    middleGrey={0.6} // 中間灰色值 默認0.6
    maxLuminance={16.0} // 最大亮度  默認16
    averageLuminance={1.0} // 平均亮度 默認1
    adaptationRate={1.0} // 亮度適應率  默認1
  />

<HueSaturation />色彩飽和度

示例：

<HueSaturation hue={0} saturation={0}
  />

參數(shù)

• hue：色調，色調偏移，弧度 默認是0
• saturation： 飽和度數(shù) 飽和度值，單位為弧度，默認是0

<Grid/>網(wǎng)格效果組件

示例及參數(shù)

<Grid
   // blendFunction={BlendFunction.OVERLAY} // blend mode
    scale={1.0} // 網(wǎng)格圖案比例 默認1
    lineWidth={0.0} // 網(wǎng)格圖案的線寬 默認0
    size={{ width, height }} // 覆蓋默認的通道(pass)的寬度和高度 無默認
  />

<GodRays>輻射線

示例及默認參數(shù)及參數(shù)默認值

 <GodRays
    sun={sunRef} //光源。必須不寫深度，并且必須被標記為透明。
    blendFunction={BlendFunction.Screen} // 這種效果的混合功能。
    samples={60} // 每個像素的樣本數(shù)。
    density={0.96} //  光線的密度。
    decay={0.9} // 衰變 照明衰減系數(shù)
    weight={0.4} // 光線權重
    exposure={0.6} // 曝光  一個曝光系數(shù)。
    clampMax={1} // 整體效果的飽和度的上限。
    width={Resizer.AUTO_SIZE} // Render width.
    height={Resizer.AUTO_SIZE} // Render height.
    kernelSize={KernelSize.SMALL} // 模糊的內核大小。如果模糊功能被禁用，則沒有影響。
    blur={true} // 霧化效果的光照是否應該被模糊化以減少偽影。
  />

補充：下面介紹下對焦距離和焦距

對焦距離和焦距

對焦距離：是指鏡頭最前端鏡片與拍攝物體的距離。
對焦距離：就是您的相機在拍攝物體的時候需要離被攝物體一定距離這樣相機才可以拍攝清楚，否則相機無法對焦。對焦距離近的話適合拍攝小物件，這就是為什么有的鏡頭叫微距鏡頭，說的就是可以離被攝物體近，這樣拍攝的就會更清楚，最簡單容易理解就這樣解釋了。在選擇數(shù)碼相機的時候尤其是家用DC的時候會經(jīng)常有寫微距拍攝距離，有的相機可以達到1cm 還有更厲害的相機可以達到0cm 也就是說可以貼在物體上拍攝了，當然是否有這個必要，就看在拍攝的時候你自己的興趣愛好了。
焦距：一般在相機的鏡頭上會有寫 XXmm或者 XX-XXXmm類似 變焦18-55mm ，28-200mm 還有就是定焦 50mm 焦距簡單的可以理解為拍攝畫面的遠近和角度范圍大小。人的眼睛視野范圍如果用鏡頭焦距來作為參考就是50mm的 所以為什么管50mm的鏡頭稱為標頭，就是符合人的眼睛視角范圍。這個數(shù)值越大說明可以拍的越遠，數(shù)值越小可以拍的越廣，所以小于或者等于28mm的一般都稱為廣角鏡頭 大于70mm以上的例如200mm都稱為長焦鏡頭，如果數(shù)值特小的一般都稱為魚眼鏡頭，魚眼鏡頭拍的更廣，所以在選擇鏡頭的時候經(jīng)常會看到廠家一個參數(shù)鏡頭變焦范圍 28－105mm 就是說這個鏡頭廣角端可以到28mm的 長焦端可以到105mm 這個對于選擇相機是一個很重要的參數(shù)。數(shù)值變化越大說明拍攝范圍就越廣泛了。
焦距：相機的鏡頭是一組透鏡，當平行光線穿過透鏡時，會會聚到一點上，這個點叫做焦點，焦點到透鏡中心的距離，就稱為焦距。焦距固定的鏡頭，即定焦鏡頭；焦距可以調節(jié)變化的鏡頭，就是變焦鏡頭。

到此這篇關于react-three/postprocessing庫的參數(shù)中文含義使用總結的文章就介紹到這了,更多相關react中文含義使用內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！

最新評論