是否有可能在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）