使用2D和3D上下文的Canvas 3D绘图

Question

由于webgl/opengl不支持文本绘制，所以可以使用3D上下文绘制3D对象，使用2D上下文绘制文本吗？

Answer 1

不，不幸的是没有。

HTML 5 spec说明，如果在已在不同context mode中的画布元素上调用getContext，并且两个上下文不兼容，则返回null。

不幸的是，"webgl“和"2d”画布是不兼容的，因此你会得到null：

var canvas = document.getElementById('my-canvas');
var webgl = canvas.getContext("webgl"); // Get a 3D webgl context, returns a context
var twod = canvas.getContext("2d"); // Get a 2D context, returns null

Answer 2

如上所述，您不能这样做。

但是，您可以将一个画布放在另一个画布上，然后分别绘制到它们。我以前也这样做过，它可以很好地工作。

Answer 3

使用canvas 2D创建文本作为纹理，然后在3D中渲染它。有关教程，请参阅here。