HTML5 Canvas for Internet Explorer via Flash

Dropdown Menu

Known Issues and Limitations

FlashCanvas Pro is still under development and has some problems. If you find a problem which is not listed below, please report it on the forum or the issue tracker.


  • FlashCanvas Pro supports "darker" operator as with some other browsers. This operator is translated into the MULTIPLY blend mode of Flash because its definition is not included in the specification.



  • You should use isPointInPath() with care because it is implemented approximately.
    • Marginal region is regarded as the inside.
    • Vertex of very sharp angle can be regarded as the outside.


  • The Canvas specification defines the interpretation of relative length units as follows:

    When the 'font-size' component is set to lengths using percentages, 'em' or 'ex' units, or the 'larger' or 'smaller' keywords, these must be interpreted relative to the computed value of the 'font-size' property of the corresponding canvas element at the time that the attribute is set.

    But it's almost impossible to detect the change in the font attribute because JScript does not support setter. Hence, FlashCanvas uses the value of 'font-size' at a time when fillText() or strokeText() is executed.

drawImage() / createPattern()

  • drawImage() and createPattern() methods can take an HTMLCanvasElement as an argument. But you should know that this canvas-to-canvas copy feature has a restriction originated from Flash; you cannot copy an image from hidden/offscreen canvases. For example, here is a result of our little experiment.
    <canvas id="canvas1" width="100" height="100"></canvas>
    <canvas id="canvas2" width="100" height="100"></canvas>
    #canvas1 {
        position: absolute;
        left: -99px;

    This canvas1 is nearly hidden, but its right edge is inside the screen. In this case, we can copy the image from canvas1 to canvas2 without problems. If we change the position to {left: -100px}, however, canvas1 becomes entirely hidden, and the copy fails.

  • FlashCanvas requires not a little time to copy an image from other canvases. If you'd like to copy images fast, it is better to utilize a copy within the same canvas as shown in the following code. In that case, the copy requires little time.
    var canvas = document.getElementById("mycanvas");
    var ctx = canvas.getContext("2d");
    // Copy the image from left to right within the same canvas.
    ctx.drawImage(canvas, 0, 0, 100, 100, 100, 0, 100, 100);

    If you'd like to hide the source of the copy, you can place that region in an off-screen area or under some other element.

  • Though FlashCanvas can use a data URI scheme as an image, Internet Explorer cannot handle long URLs well. To avoid this problem, drawImage() and createPattern() methods of FlashCanvas accept any object that has a src property. Namely, you can write your code in the following way.
    var img, url;
    if (typeof FlashCanvas != "undefined") {
        // Create an Object instance instead of an Image object.
        img = {};
        img.src = url;
    } else {
        img = new Image();
        img.onload = onLoad;
        img.src = url;
    function onLoad() {
        ctx.drawImage(img, 0, 0);

getImageData() / putImageData()

  • getImageData() and putImageData() are very slow. The data transfer between JavaScript and Flash takes much time.