0

excanvasを使用してcanvasをIEで動作させようとしています。しかし、それはどこにも現れていないようです。

以下のコードは、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>
4

1 に答える 1

0

理由は聞かないでください。静的なキャンバスを作成して描画した後、動的に作成されたキャンバスが機能し始めます...また、ボディの「onload」で「load」メソッドを呼び出すと、直接実行するのではなく、あまりにも重要である（繰り返しますが、なぜそれがそのように動作するのかは私の理解を超えています）。

以下の解決策は私にとってはうまくいきました（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>
于 2011-12-30T23:51:38.570 に答える