在哪里将 mozimageSmoothingEnabled 替换为 imageSmoothingEnabled

Question

我有一个非常简单的 HTML/Js 代码，可以在 canvas 上绘制一个简单的圆圈。

const canvas=
document.querySelector('#canvas1');
const ctx= canvas.getContext('2d');
ctx.canvas.width= window.innerWidth;
ctx.canvas.height= window.innerHeight;

class Particule{
    constructor(x, y, dirX, dirY, taille, coul){
        this.x= x;
        this.y= y;
        this.dirX= dirX;
        this.dirY= dirY;
        this.taille= taille;
        this.coul= coul;
    }
    dessine(){
        ctx.beginPath();
        ctx.arc(this.x, this.y, this.taille, 0,
            Math.pi * 2, false);
        ctx.fillStyle= this.coul;
        ctx.fill();
    }
}

const ob= new Particule(10, 10, 50, 50, 100, "white");
ob.dessine();
console.log(ob);

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

#canvas1{
    position: absolute;
    width: 100%;
    height: 100%;
    background: #333;
}

<!DOCTYPE html>
<html>
<head>
    <title>Particles</title>
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="style.css">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
    <canvas id="canvas1">
    </canvas>
    <script type="text/javascript" src='script.js'></script>
</body>
</html>

代码应该在屏幕的左上角输出一个白色圆圈，但是当我启动它时，即使控制台上没有错误日志，也只会出现深灰色背景。在 Firefox 上，这是一个警告说

Use of mozImageSmoothingEnabled is deprecated. Please use the unprefixed imageSmoothingEnabled property instead.

我认为 'may' 是事情无法正常工作的原因。问题是我的代码中没有任何地方 mozImageSmoothingEnabled 或 ImageSmoothingEnabled。一开始我什至没有使用它，所以我怎么能替换它呢？

我使用的是最新版本的 Firefox，但在任何地方都找不到任何帮助。

如果有人能告诉我如何解决这个问题，那将很有帮助。

提前致谢。

Answer 1

你应该使用Math.PI而不是Math.pi兄弟^_^

建议

使用现代 IDE/Code 编辑器可以帮助您解决这些小错误。
使用调试器对什么值使用计算机。如果您在开始时创建断点并逐步查看代码中的所有值，您会发现问题出在 Math.pi

在哪里将 mozimageSmoothingEnabled 替换为 imageSmoothingEnabled

Where do I replace mozimageSmoothingEnabled to imageSmoothingEnabled

html

javascript

html5-canvas

建议