Javascript 为什么canvas.arc不工作？

我在网页的末尾有以下代码：

var canvas = document.getElementByID("canvas");
var ctx = canvas.getContext("2d");
canvas.style.width = $(window).width();
canvas.style.height = $(window).height();
ctx.arc(50, 50, 50, 0, Math.PI * 2, false);
$(window).resize(function () { 
  canvas.style.width = $(window).width();
  canvas.style.height = $(window).height();
  console.log("resize");
});

但是什么也没有出现。我知道问题出在arc函数上，因为

ctx.fillRect（0，0，100，100）工作正常

知道我做错了什么吗

（是的，我有JQuery）
您需要在ctx.arc（）之前使用ctx.beginPath（），然后使用ctx.stroke（），这会告诉画布在开始绘制之前清理缓冲区，并在绘制完成后将缓冲区输出到画布。fillRect（）/strokeRect（）已经为您处理这些开始/结束任务。
您需要执行路径：

var canvas = document.getElementByID("canvas");
var ctx = canvas.getContext("2d");
canvas.style.width = $(window).width();
canvas.style.height = $(window).height();

ctx.beginPath(); // <-- start a path

ctx.arc(50, 50, 50, 0, Math.PI * 2, false); // <-- add the arc to the path

ctx.strokeStyle = "#000000"; // <-- set fill color
ctx.stroke(); // <-- draw the arc

$(window).resize(function () { 
  canvas.style.width = $(window).width();
  canvas.style.height = $(window).height();
  console.log("resize");
});

var canvas=document.getElementByID（“canvas”）；
var ctx=canvas.getContext（“2d”）；
canvas.style.width=$（window.width（）；
canvas.style.height=$（window.height（）；
ctx.beginPath（）；//
首先，第一行中的ID必须是ID
然后，对于arc函数，需要有一个ctx.beginPath（）
函数启动

然后给它上色，例如：ctx.fillStyle=“给你上色
“需要”
然后，你的弧函数ctx.arc（50,50,50,0，Math.PI*2，
假）就是这样
然后在最后放ctx.fill（）以完成
过程
就我而言，我把Math.PI误认为Math.PI