Javascript 绘制画布在移动设备上不起作用，在桌面上可以正常工作

我在设置绘图画布时遇到一些问题。我的web应用程序允许用户在画布上绘制一个数字，然后使用机器学习对该数字进行分类。但是，画布在移动设备上不起作用。当我尝试在移动设备上画画时，什么也没发生，我只是向上、向下、向左或向右滚动。下面是我的画布javascript代码，非常感谢大家的帮助

//window.addEventListener（“加载”，（）=>{
const canvas=document.querySelector（“#canvas”）；
const ctx=canvas.getContext（'2d'）；
var rect=canvas.getBoundingClientRect（）；
ctx.translate（-rect.x，-rect.y）；
让绘画=虚假；
功能启动位置（e）{
绘画=真实；
抽签（e）；
}
函数finishedPosition（）{
绘画=假；
ctx.beginPath（）；
}
功能图（e）{
如果（！喷漆）返回；
ctx.线宽=20；
ctx.lineCap='圆形'；
ctx.strokeStyle=“黑色”；
ctx.lineTo（e.clientX，e.clientY）；
ctx.stroke（）；
ctx.beginPath（）；
ctx.moveTo（e.clientX，e.clientY）；
}
函数translateCanvasResize（e）{
var rect2=canvas.getBoundingClientRect（）；
ctx.translate（rect.x-rect2.x，rect.y-rect2.y）
rect=rect2
}
函数translateCanvasScroll（e）{
var rect2=canvas.getBoundingClientRect（）；
ctx.translate（rect.x-rect2.x，rect.y-rect2.y）
rect=rect2
}
canvas.addEventListener（'mousedown'，startPosition）；
canvas.addEventListener（'mouseup'，finishedPosition）；
canvas.addEventListener（'mouseout'，finishedPosition）；
canvas.addEventListener（'mousemove'，draw）；
canvas.addEventListener（'touchstart'，startPosition）；
canvas.addEventListener（'touchend'，finishedPosition）；
canvas.addEventListener（'touchmove'，draw）；
addEventListener（'resize'，translateCanvasResize）；
window.addEventListener（'scroll'，translateCanvasScroll）；
//});
画布{
边框：1px纯黑；
}
您需要调用您的触摸事件：

  function draw(e) {
    e.preventDefault();