three.js - 在three.js 中是否可以裁剪视口？

Question

我有一个场景，中间有一个球体，一个相机在它周围旋转。现在我想知道是否可以使用 Three.JS 裁剪此视口，以便例如球体出现在左侧或右侧。

我不想移动相机或看球体以外的点，因为这会扭曲透视，而是渲染的剪辑或裁剪。

这可能吗？

Answer 1

一种可能的解决方案是在您的 Three.js 画布上放置第二个画布，然后通过 blitting 将 three.js 场景重新绘制到您的第二个画布上：

overlayCanvas.getContext('2d').drawImage(threeCanvas, 40, 40, 960, 960, 0, 0, 1200, 1200);

您可以在文档中阅读有关 drawImage() 参数的更多信息，但它的作用是裁剪 three.js 画布的某个区域并将其拉伸到第二个画布的更大区域。它应该比第二次渲染场景要快得多，并且它会以你想要的大小显示（尽管有一些拉伸）。

您可以通过以比通常显示的更大尺寸绘制原始（three.js）场景来缓解拉伸，这样您想要裁剪到视图中的区域与您的辅助画布大小相同。