HTML5画布上下文

我已经开始阅读/试验HTML5。我已经看到了HTML5的Canvas的所有教程遵循的JavaScript获得通过ID画布，让2D背景，然后与上下文工作模式：HTML5画布上下文

<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>

我想知道是否有任何枚举或为画布获取上下文的常量。（我知道这不是一个真正的常量，只是想知道在JavaScript或HTML5中是否有类似的东西）。

我见过的每个例子都是简单的getContext("2d")。这看起来很脆弱，也没有告诉我可能有哪些其他（如果有的话）上下文。

来源

2013-01-18 Philip Tenn

我认为现在只是'2d'或'webgl'。 – paul

@paul感谢您通知我关于webgl ......我不知道这是可以传递的字符串之一。我认为这将是'3d'。 –

您只需要调用getContext一次，如果再次调用它，如果画布已经使用不同的上下文类型初始化，它将返回null。如果使用相同的上下文类型再次调用它，它将返回相同的上下文。如果画布不支持给定的上下文ID字符串，则也会返回空值。

换句话说，每个画布只有一个上下文。

不告诉我可能有哪些其他（如果有）上下文。

为此，有一个方法supportsContext(someContextString)，这是非常新的规范（2012年3月），尚未在任何浏览器中实现。

还有另外的setContext还没有在任何浏览器支持（可能在几晚）。请注意，setContext仅在您创建了无头环境时才有用，因为如果您尝试设置不同的环境，则已经具有上下文（通过使用getContext）的画布将引发错误。

无论如何，参数是一个字符串的原因是允许浏览器特定的画布扩展。毕竟，MS可能想要实施getContext('2d-directx')（他们可能永远不会这样做）。

这几天你会看到的唯一字符串是"2d"，"webgl"和"webgl-experimental"。

来源

2013-01-18 20:49:50

这是一个非常丰富的答案，谢谢你分享所有伟大的信息。我从来没有听说过'supportsContext'方法或尚未支持的setContext。 –

HTML5画布上下文

回答

相关问题