Opera：在 JavaScript 中绘制椭圆形时出现问题
只是为了好玩和学习的目的，我目前正在编写一个基于 javascript 的绘画应用程序，但是我在椭圆形的绘制代码方面遇到了一些跨浏览器问题。
这是我的代码，简化为一个简单的椭圆函数：
function Oval(context, x, y, radiusX, radiusY, color, filled) {
if ((radiusX === 0) || (radiusY === 0)) {
return;
}
context.save();
context.translate(x, y);
if (radiusX !== radiusY) {
context.scale(1, radiusY / radiusX);
}
context.beginPath();
context.arc(0, 0, radiusX, 0 , 2 * Math.PI);
context.closePath();
context.restore();
if (filled === true) {
context.fillStyle = color;
context.fill();
} else {
context.strokeStyle = color;
context.stroke();
}
}
var ctx = c.getContext("2d");
Oval(ctx, 150, 150, 100, 149, "#663399", false);<canvas id="c" width="300" height="300"></canvas>这在当前稳定版本的 Firefox、Chrome、Internet Explorer 和 Safari 中效果很好。但Opera似乎并不喜欢它。可能是什么问题？
just for fun and for learning purposes, I'm currently writing a javascript-based paint application, but I've experienced a little cross-browser problem with the drawing code of the oval shape.
Here's my code, reduced to a simple oval function:
function Oval(context, x, y, radiusX, radiusY, color, filled) {
if ((radiusX === 0) || (radiusY === 0)) {
return;
}
context.save();
context.translate(x, y);
if (radiusX !== radiusY) {
context.scale(1, radiusY / radiusX);
}
context.beginPath();
context.arc(0, 0, radiusX, 0 , 2 * Math.PI);
context.closePath();
context.restore();
if (filled === true) {
context.fillStyle = color;
context.fill();
} else {
context.strokeStyle = color;
context.stroke();
}
}
var ctx = c.getContext("2d");
Oval(ctx, 150, 150, 100, 149, "#663399", false);<canvas id="c" width="300" height="300"></canvas>This works nice in current stable versions of Firefox, Chrome, Internet Explorer and Safari. But Opera doesn't seem to like it. What might be the problem ?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
这是因为 Opera 需要 arcc 的最后一个参数
，因此将其更改为
context.arc(0, 0, radiusX, 0 , 2 * Math.PI, false );你就会变得很幸运。This is because Opera requires the last argument to
arcSo change it to
context.arc(0, 0, radiusX, 0 , 2 * Math.PI, false);and you'll be golden.我们已经在内部版本中修复了这个问题，并且应该很快就会在稳定版本中发布！
We have fixed this in an internal build, and should be out soon in a stable release!