canvas Support in Opera

The canvas element enables a bitmap drawing API in HTML. It can be considered the scripted version of the img element. To draw a simple green square you would use the following code:

<!doctype html>
<html>
 <head>
  <title>&lt;canvas> demo</title>
  <style> canvas { border:solid } </style>
 </head>
 <body>
  <p><canvas width="150" height="200">
   <code>canvas</code> element not supported.
  </canvas></p>
  <script type="text/javascript">
   var canvas = document.getElementsByTagName("canvas"),
       context = canvas.getContext("2d")
   context.fillStyle = "lime"
   context.fillRect(0, 0, 150, 200)
  </script>
 </body>
</html>

Two interfaces are important for the canvas element: the HTMLCanvasElement interface which is exposed by the element and the CanvasRenderingContext2D interface which is what's being returned with the getContext("2d") method call.

HTMLCanvasElement support
MemberSupportedNotes
widthYes-
heightYes-
toDataURL()Yes-
toDataURL()No-
getContext()YesOpera supports "2d" and "opera-2dgame" as parameters.

The "opera-2dgame" parameter of the getContext() method is not guarenteed to be supported in future versions of Opera and should be considered experimental. Similar functionality to what it exposes has been added to the canvas specification based on feedback from Opera and Opera will add support for those new methods in due course.

CanvasRenderingContext2D support
MemberSupportedNotes
canvasYes-
save()Yes-
restore()Yes-
scale(x, y)Yes-
rotate(angle)Yes-
translate(x, y)Yes-
transform(m11, m12, m21, m22, dx, dy)No-
setTransform(m11, m12, m21, m22, dx, dy)No-
globalAlphaYes-
globalCompositeOperationYes-
strokeStyleYes-
fillStyleYes-
createLinearGradient(x0, y0, x1, y1)Yes-
createRadialGradient(x0, y0, r0, x1, y1, r1)Yes-
createPattern(image, repetition)Yes-
lineWidthYes-
lineCapYes-
lineJoinYes-
miterLimitYes-
shadowOffsetXNoSupport is optional.
shadowOffsetYNoSupport is optional
shadowBlurNoSupport is optional
shadowColorNoSupport is optional
clearRect(x, y, w, h)Yes-
fillRect(x, y, w, h)Yes-
strokeRect(x, y, w, h)Yes-
beginPath()Yes-
closePath()Yes-
moveTo(x, y)Yes-
lineTo(x, y)Yes-
quadraticCurveTo(cpx, cpy, x, y)Yes-
bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y)Yes-
arcTo(x1, y1, x2, y2, radius)Yes-
rect(x, y, w, h)Yes-
arc(x, y, radius, startAngle, endAngle, anticlockwise)Yes-
fill()Yes-
stroke()Yes-
clip()Yes-
isPointInPath(x, y)No-
drawImage(image, dx, dy)Yes-
drawImage(image, dx, dy, dw, dh)Yes-
drawImage(image, sx, sy, sw, sh, dx, dy, dw, dh)Yes-
getImageData(sx, sy, sw, sh)No-
putImageData(image, dx, dy)No-