ThreeJs VideoTexture 抗锯齿/分辨率

Question

所以我在 ThreeJS 中有一个 VideoTexture，它的渲染非常像素化。

渲染器的实际pixelDensity 很多，并且场景的其余部分渲染得相当清晰 - 我已经搜索了很多关于在这里做什么的信息，但我找不到任何东西。

• 各向异性设置无任何作用，无论设置的数字是多少
• 将pixelDensity 增加到一个异常高的数字会有所帮助，但不能解决问题
• 视频本身非常高清
• 我尝试将FXAA 用作shaderPass，但这似乎也没有任何作用

有谁知道如何获得清脆的VideoTexture？当然有可能得到比下面更好的东西。我创建纹理/材质的方式有什么问题吗？

video.load()
video.play()

const texture = new VideoTexture(video)
texture.encoding = sRGBEncoding

const material = new MeshStandardMaterial({
  map: texture,
  side: FrontSide,
})

const geometry = new PlaneGeometry( 30, 17, 32 )

Answer 1

尝试更改纹理的minification and magnification filters。如果你使用NearestFilter，它会变得非常像素化，但你可以使用LinearFilter 来获得纹素之间的平滑插值：

const texture = new VideoTexture(video);
texture.encoding = sRGBEncoding;
texture.magFilter = THREE.LinearFilter;