<canvas> кроссбраузер - IE

Question

Как создать работающий кросс-браузерный скрипт с jCanvas

• В IE8 холст не добавляется ..
• В FF и Chrome нарисованная рамка не расположена в правильных координатах? Начальная точка находится вне области просмотра?!

fsfiddle:

http://jsfiddle.net/4GSXC/

Код:

<!--[if IE]><script src="http://secure.dynaccount.com/js/jquery/excanvas.min.js" type="text/javascript"></script><![endif]-->
<script src="http://secure.dynaccount.com/js/jquery/jcanvas.5.0.min.js" type="text/javascript"></script>

        function Canvas_overview(){
            var _this = this;

            this.width = 900;
            this.height = 360;

            this.frm_x = 80;
            this.frm_y = 30;
            this.frm_width = 800;
            this.frm_height = 280;

            this.cnstr = function(elm){
                var canvas = $('<canvas width="'+this.width+'" height="'+this.height+'" style="border:1px solid black"></canvas>').appendTo(elm)
                    .drawRect({
                        strokeStyle: '#969696',
                        strokeWidth: 1,
                        x: this.frm_x,
                        y: this.frm_y,
                        width: this.frm_width,
                        height: this.frm_height
                    });
            };
        }

        var Canvas = new Canvas_overview();
        Canvas.cnstr($('body'));

Answer 1

Поскольку excanvas не поддерживает все, я на самом деле рекомендую использовать FlashCanvas .Скорее всего, это сработает, чем excanvas (так как excanvas у меня никогда не работал).

Что касается "неправильных" координат, jCanvas по умолчанию рассматривает (x, y) координаты в центре фигуры (скореечем верхний левый угол).Вы можете легко переопределить это поведение, установив для свойства fromCenter значение false (в вашем объекте).

Надеюсь, это поможет.

-Caleb