HTML5畫布上下文

Question

我已經開始閱讀/試驗HTML5了。 我見過的HTML5 Canvas的所有教程都遵循JavaScript的模式，通過ID獲取畫布，獲得2d上下文，然后使用上下文：

 <canvas id="myCanvas" width="300" height="200" style="border:1px solid"></canvas>
 <script>
   var c=document.getElementById("myCanvas");
   var ctx=c.getContext("2d");
   ctx.fillStyle="cyan";
   ctx.fillRect(50,50,100,75);
 </script>

我想知道是否有任何枚舉或常量來獲取畫布的上下文。

像Context.2D ， Context.3D等等（我知道這不是一個真正的常量，只是想知道在JavaScript或HTML5中是否存在類似的東西）。

我看到的每個例子，所做的調用都是getContext("2d") 。 這似乎很脆弱，也沒有告訴我其他（如果有的話）上下文可能是什么。

Answer 1

你只調用一次getContext ，如果再次調用它，如果畫布已經用不同的上下文類型初始化，它將返回null。 如果再次使用相同的上下文類型調用它，它將返回相同的上下文。 如果畫布不支持給定的上下文ID字符串，也會返回Null。

換句話說，每個畫布只有一個上下文。

沒有告訴我其他（如果有的話）上下文可能是什么。

為此，有一個方法supportsContext(someContextString) ，這是一個非常新的規范（2012年3月），尚未在任何瀏覽器中實現。

還有任何瀏覽器尚未支持的setContext （可能在幾個nightlies中）。 請注意， setContext僅在您創建無頭上下文時才有用，因為如果您嘗試設置另一個上下文，則已具有上下文的畫布（通過使用getContext）將引發錯誤。

無論如何，參數是字符串的原因是允許對畫布進行特定於瀏覽器的擴展。 畢竟，MS可能想要實現getContext('2d-directx') （他們可能永遠不會這樣做）。

這些天你唯一能看到的字符串是"2d" ， "webgl"和"webgl-experimental" 。