Excanvas: не отображается на странице

Я пытаюсь заставить холст работать с IE, используя excanvas. Однако, похоже, он нигде не появляется.

Приведенный ниже код работает во всех браузерах, кроме IE.

Я пытался следовать предложениям на странице проекта excanvas, но безрезультатно.

Любая помощь будет оценена по достоинству!

  <html>
    <head>
        <script type="text/javascript" src="jquery.js"></script>
        <script type="text/javascript" src="excanvas.compiled.js"></script>
    </head>
    <body id="body">


<script type="text/javascript">

    load();

    function load(){

        var canvas = document.createElement("canvas");

        if(typeof G_vmlCanvasManager !== "undefined")
            G_vmlCanvasManager.initElement(canvas);

        var ctx = canvas.getContext("2d");
        ctx.fillStyle = "#FF0000";
                ctx.beginPath();
                ctx.arc(50,50,12,0,Math.PI*2,true);
                ctx.closePath();
                ctx.fill();

        document.getElementById("body").appendChild(canvas);
    }




</script>
    </body>
</html>

canvas internet-explorer excanvas
person KDV    schedule 30.12.2011    source источник
comment
Если вы используете IE8, упоминание режима причуд в stackoverflow.com/questions/941170/ может помочь.   -  person Wolfgang Kuehn    schedule 31.12.2011

Ответы (1)


arrow_upward
0
arrow_downward

Не спрашивайте меня, почему, но, видимо, после создания статического холста и рисования на нем динамически созданные начинают работать... Кроме того, вызов метода "загрузки" в "загрузке" тела - вместо того, чтобы делать это напрямую - кажется быть важным (опять же, почему он так себя ведет, я не понимаю).

Приведенное ниже решение отлично сработало для меня (IE6):

<html>
    <head>
        <script type="text/javascript" src="jquery.js"></script>
        <script type="text/javascript" src="excanvas.compiled.js"></script>
    </head>
    <body onload="load()" id="body">
        <canvas id="static" style="display:none"></canvas>
        <script type="text/javascript">
            function load(){
                // Static
                var canvas = document.getElementById("static");
                var ctx = canvas.getContext("2d");
                ctx.fillStyle = "#FF0000";
                        ctx.beginPath();
                        ctx.arc(50,50,12,0,Math.PI*2,true);
                        ctx.closePath();
                        ctx.fill();
                // Dynamic
                var canvas = document.createElement("canvas");

                if(typeof G_vmlCanvasManager !== "undefined")
                    G_vmlCanvasManager.initElement(canvas);

                var ctx = canvas.getContext("2d");
                ctx.fillStyle = "#FF0000";
                        ctx.beginPath();
                        ctx.arc(50,50,12,0,Math.PI*2,true);
                        ctx.closePath();
                        ctx.fill();

                document.getElementById("body").appendChild(canvas);
            }
        </script>
    </body>
</html>
person mgibsonbr    schedule 30.12.2011
comment
Ваш совет сработал! Мне пришлось дождаться загрузки тела, а также добавить динамически созданный элемент холста ПЕРЕД его инициализацией с помощью G_vmlCanvasManager. - person KDV; 31.12.2011