Javascript 按住鼠标时，在画布上鼠标位置连续绘制矩形

我正在尝试使用javascript和HTML画布制作一个绘图程序，我需要在鼠标的位置连续画一个圆，我不确定该如何做。我有一个粗略的想法，但我的代码（毫不奇怪）不起作用。你知道我该怎么做吗？代码在这里

var canvas=document.getElementById（'drawing'）；
var ctx=canvas.getContext（'2d'）
var绘图=错误
函数startmoving（）{drawing=true；}
函数stopmoving（）{drawing=false；}
函数绘图（）{
如果（图==真）{
ctx.fillstyle='黑色'；
ctx.fillRect（event.clientX，event.clientY，4,4）
}
设置间隔（图纸10）；
}

您需要为画布设置一个mousedown/mouseup和mousemove侦听器，然后如果鼠标向下，则在坐标处制作并放置一个矩形，如果鼠标向上，则停止绘图。此外，clientX和clientY用于页面左上角的可见部分。pageX和pageY位于页面的左上角。因此，如果使用clientX和clientY向下滚动，它将在当前页面的位置绘制，使其看起来很奇怪。修理？使用pageX和pageY（用pageX和pageY替换clientX和clientY）

var canvas=document.getElementById（'drawing'）；
var绘图=错误；
//如果鼠标按下，则启动绘图
canvas.addEventListener（'mousedown'，（）=>{
绘图=真；
})
//如果鼠标已启动，请停止绘图
canvas.addEventListener（'mouseup'，（）=>{
图纸=假；
});
//将事件侦听器添加到画布，以便在用户将鼠标移到画布上且鼠标按下时使用
canvas.addEventListener（'mousemove'，（事件）=>{
var ctx=canvas.getContext（'2d'）；
//如果绘图模式为真（如果鼠标按钮按下）
如果（图==真）{
//做一个黑色的长方形
ctx.fillstyle='黑色'；
//将矩形放在画布上鼠标坐标处
ctx.fillRect（event.clientX，event.clientY，4,4）
}
});

您可以设置一个间隔来画一个圆圈，直到触发鼠标向上移动事件，然后清除该间隔。我想，我会告诉您它是否有效。我认为clientX和clientY-tough可能也有问题。注：我有一个聊天室，需要一些成员，从你的个人资料来看，你看起来像那种人，将是伟大的有那里。如果你感兴趣，这是链接。event.clientX和event.clientY必须位于事件侦听器下。没有“事件”变量，因为它没有包装在事件侦听器中。还有，我误解了你的问题。您希望在程序启动时绘制圆。我会发布一个应该有用的答案。那我就是个白痴了，修好了。检查我的答案。如果你需要澄清，只需问：）我只想在鼠标在画布上下移动的时候做这件事。我想我自己可以弄清楚，但要不断更新。非常感谢。要加入聊天室吗？你看起来很好