【问题标题】：<canvas> crossbrowser - IE<canvas> 跨浏览器 - IE
【发布时间】：2012-01-17 19:28:07
【问题描述】：

如何使用 jCanvas 制作一个有效的跨浏览器脚本

在 IE8 中不附加画布..
在 FF 和 Chrome 中，绘制的框架没有定位在正确的坐标上？起点在视口之外？！

fsfiddle：

代码：

<!--[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'));

【问题讨论】：

标签： jquery html canvas jcanvas

【解决方案1】：

由于 excanvas 不支持所有功能，我实际上建议使用FlashCanvas。它似乎比 excanvas 更有效（因为 excanvas 从来没有为我工作过）。

关于“错误”的坐标，jCanvas 默认认为 (x, y) 坐标位于形状的中心（而不是左上角）。您可以通过将 fromCenter 属性设置为 false（在您的对象中）轻松覆盖此行为。

希望对您有所帮助。

-迦勒

【讨论】：