是否有可能在threejs中概述视图端口？

Question

我用两个摄像头和一个渲染器创建了一个场景。每个摄像头都从不同的角度观察场景，并且我在第一个渲染器的顶部放置了一个小视图端口，并在第一个渲染器上渲染了第一个摄像头。我想知道是否有办法让第二个查看端口概述，使每个看起来分开

Answer 1

是的，可以通过使一个纯色的矩形比之前呈现的插图的插图稍大轮廓的插入口。

// border 
renderer.setScissorTest(true); 
renderer.setScissor(x, y, width, height); 
renderer.setClearColor(0xffffff, 1); // border color 
renderer.clearColor(); // clear color buffer 

然后，渲染插图。只要确保背景是不透明的。

three.js所r.86

Answer 2

我想你正在使用threejs视口功能？据我所知，它本身并没有这样的功能。

但是，由于它被渲染到画布上......也许你可以在每个三维渲染帧之后在画布上以自己想要的坐标绘制一个轮廓？

一个基本的例子：

var c=document.getElementById("myCanvas"); 
var ctx=c.getContext("2d"); 
ctx.rect(20,20,150,100); 
ctx.stroke(); 

（参考：https://www.w3schools.com/tags/canvas_rect.asp）