opera下canvas的一个bug作者：Neoxone 发表时间： 2010年12月11号，星期六 阅读：5,106 次 测试的opera版本为10.63 <!doctype html> <html> <head> <meta charset='UTF-8' /> <title>A canvas bug about scale-arc in Opera</title> <style> *{padding:0;margin:0;} html,body{height:100%;overflow:hidden;} </style> </head> <body> <canvas id="pad" width='1800' height='1000' style='border:1px solid #ccc'>ie用户(9以下)请忽略</canvas> <script type="text/javascript"> var $id=function(n){ return document.getElementById(n) || n; } function draw(){ var con=$id("pad").getContext('2d'); con.translate(100,100); con.moveTo(0,0); con.arc(0, 0, 50 ,0, Math.PI*2/4, false); //以角度0°经45°到90°(math.PI*2/4)方向绘制曲线 con.translate(200,0); con.moveTo(0,0); con.scale(-1, 1); //水平翻转,同transform(-1,0,0,1,0,0); con.arc(0, 0, 50 ,0, Math.PI*2/4, false); //经过翻转之后再次绘制曲线 con.stroke(); } draw(); </script> </body> </html> 对照其他浏览器,firefox,safari,chrome,ie9 发现:翻转之后，arc曲线方法在Opera下显得不可理解。 （绘制圆0-Math.PI*2是个例外，不会出现问题） 相关文章:《笛卡尔情书的秘密——心形函数的绘制》《《ie9大风车》与《忍者镖》》《Transform变形方法的可视化演示》《百度UEO基于canvas绘制热力图的演示》《canvas的像素级操作——1.引子》 标签： arc, canvas, scale 这篇文章发布于 2010年12月11号，星期六，16:03，归类于 HTML5, 浏览器与兼容。 您可以跟踪这篇文章的评论通过 RSS 2.0 feed。 您可以留下评论，或者从您的站点trackback。
这个和 微软的 metro 桌面 很像的说
回复
[...] （事实上，opera在canvas下的绘制方法有挺多的问题的，比如http://www.cssass.com/blog/index.php/2010/879.html，http://philip.html5.org/demos/canvas/arcto-emulate.html）。 本条目发布于 2011 年 5 月 13 日。属于 web前端 分类。作者是 admin。 [...]