Question

我正在（0,0,0）位置创建一个几何，但在其他位置（例如@ 50,50,50）投影。如果（0,0,0）点超出了画布范围，则几何图形处于隐藏状态。

有什么办法可以始终将其呈现在画布上吗？

Answer 1

原点距离边缘有多远？

您可以使画布大于所需的大小，而不是遮盖边缘区域，以便仅显示中心区域。这样，当原点偏离侧面时，从技术上讲，它仍将位于画布上，并且投影的几何体将位于可见区域中。我希望您只需要一个等于投影偏移量的缓冲区即可。

有关屏蔽的示例，请参见此处：https://jsfiddle.net/shawnoakley/n1368qr0/2/

示例代码：

var context = document.getElementById('canvas').getContext('2d');

// Mask color
context.fillStyle = '#000';
// Image proportions
context.fillRect(0,0,600,400);

var unmaskedImage = function(x, y, radius){
    context.save();
    context.globalCompositeOperation = 'destination-out';
    context.beginPath();
    context.arc(x, y, radius, 0, 2 * Math.PI, false);
    context.fill();
    context.restore();
};


unmaskedImage(300, 300, 300);

我们可以在three.js中显示超出画布（3D空间）的几何图形吗？

1 个答案: