Question

我试图在画布上渲染一个简单的圆圈，它在Chrome上完美运行，但在Safari上失败了。

奇怪的是，当我尝试获得圆圈的x位置时，我得到预期的数字，所以它显然存在但是没有正确渲染。

canvas.context.beginPath();
canvas.context.strokeStyle = 'rgba(255, 153, 0, 1)';
canvas.context.lineWidth = 10;
canvas.context.arc(x, y, radius, 0, Math.PI * 2);
canvas.context.stroke();
canvas.context.closePath();

width，height和radius是在运行时计算的自定义变量，样本值为

x = 155;
y = 155; 
radius = 25.5;

但它没有修复，可以是某个范围内的任何数字。

这会在Chrome中呈现橙色圆圈，但在Safari中什么都没有，所以任何想法为什么？

Answer 1

我找到了解决方案。一个问题是radius被计算为浮点数，并且出于某种原因，Safari不会渲染半径为25.5的弧，所以我不得不这样做

Math.floor(radius)

这基本上解决了我的问题。我不知道为什么会这样，但有一个解决方案以防其他人有同样的问题

Arc不在Safari中的2D上下文中呈现

1 个答案: