This page is Not Ready

Notice: The WebPlatform project, supported by various stewards between 2012 and 2015, has been discontinued. This site is now available on github.

getContext

Method of dom/HTMLCanvasElementdom/HTMLCanvasElement

Syntax

var object = object.getContext(/* see parameter list */);

Parameters

contextId

Data-type
any

The identifier (ID) of the type of canvas to create.

Return Value

Returns an object of type DOM NodeDOM Node

ICanvasRenderingContext2D

The context object.

Examples

The following code example uses getContext to get a context to use to show a filled rectangle and filled text.

<!DOCTYPE html>
<head>
  <script type="text/javascript">
function draw()
{
  var canvas = document.getElementById("MyCanvas");
  if (canvas.getContext)
    {
    var ctx = canvas.getContext("2d");
    ctx.font = "italic 36px/2 Unknown Font, sans-serif";
    ctx.fillStyle = "blue";
    ctx.fillRect(0,0,canvas.width,canvas.height);
    ctx.fillStyle = "white";
    ctx.fillText ("Hello World",canvas.width/2,canvas.height*.8);
    }
}
</script>
</head>
<body onload="draw()" bgcolor="lightgray" >
      <div>
        <canvas id="MyCanvas" width="500" height="500" > </canvas>
      </div>
  </body>
</html>

Notes

Remarks

The getContext method returns null if the contextId value is not supported.

Syntax

Standards information

See also

Related pages

Attributions