我创建了一个THREE.js（最新版本，r71）应用程序，有时我需要手动删除3D场景以显示经典的2D内容。所以，我所做的是清除所有变量，如场景或渲染器，并使用renderer.forceContextLoss()
此方法适用于Firefox或Chrome，但Interner Explorer或Microsoft Edge不支持，这会导致我的网页出现多个延迟。我没有像在Firefox或Chrome中那样正确地找到解决方法。
如果有人有小费，请随时告诉我：）
由于
答案 0 :(得分：2)
尝试使用两个canvas标记，并按照建议的here将其中一个放在另一个上， 将它们放在父div标签中，然后使用以下css。
position:absolute;
left:0px;
top:0px;
修改
在回复您的评论时，请允许我澄清一下我的理解。
您不能同时为同一个画布提供2个上下文，并且我认为您希望为您的2D内容使用不同的上下文。
如果这个假设是正确的： 我建议您同时拥有2个画布和上下文，一个包含您的webGL上下文和三维内容，另一个包含您要用于二维内容的上下文。然后使用绝对位置覆盖这些画布，使其看起来像一个画布。 这意味着您永远不必重新加载资源来切换上下文，只需确保上面的画布是透明的。
此外，如果您将画布包装在div标签中，它将不会位于页面的左上角。
但如果我的假设错了：
也许你不想使用另一个上下文而只是希望清除屏幕，在这种情况下你不应该打电话给forceContextLoss()
如果您希望继续使用webGL上下文，但清除屏幕，则应使用clear()