Javascript 如果在画布上调用2d上下文，则Webgl上下文为空

我编写了以下JS代码：

var main=function() {
  var CANVAS=document.getElementById("your_canvas");
  CANVAS.width=window.innerWidth;
  CANVAS.height=window.innerHeight;
  //ctx=CANVAS.getContext("2d");
  //ctx.fillText("Hello World",10,50);

  /*========================= GET WEBGL CONTEXT ========================= */
  var GL;
  try {
    GL = CANVAS.getContext("experimental-webgl", {antialias: true});
  } catch (e) {
    alert("You are not webgl compatible :(") ;
    return false;
  }

  var CUBE_VERTEX= GL.createBuffer ();

};

---

如果我取消注释这两个注释行，那么webgl上下文为空。这是预期的吗？不可能在同一画布上使用2D上下文和webgl上下文？

这是意料之中的，因为webgl基本上是opengl的包装，主要用于加速3D渲染

getContext（“实验性webgl”）

本质上是告诉浏览器，定义的画布将由OpenGL/webgl独占使用。（使用OpenGL/WebGL for 2D是可能的，但除非您知道自己在做什么，否则这样做会给自己带来困难。）

---

如果您试图在3D视图上渲染文本，则必须覆盖两个不同的DOM元素（或者使用正确的3D投影渲染文本，同样是困难的时间区域）。

Ok这很有意义。谢谢您！