Javascript 图像大小调整&；在画布中拖动

我一直试图在画布中拖动并调整同一图像的大小，但我无法成功地做到这一点

我已经从第一个链接中选择了拖动代码，从第二个链接中选择了调整大小代码，但是在组合这些代码时，最终输出有一些错误和问题。我还添加了一个上传图像按钮，用户可以从本地目录中选择要上传到画布的图像，该按钮工作正常

$（函数（）{
$（“#文件输入”）.change（函数（e）{
var file=e.target.files[0]，
imageType=/image.*/；
如果（！file.type.match（imageType））
返回；
var reader=new FileReader（）；
reader.onload=文件onload；
reader.readAsDataURL（文件）；
});
函数fileOnload（e）{
变量$img=$（'=imageHeight）？“宽”：“高”；
画（真的，真的）；
}
img.src=canvas.toDataURL（）；
var-border=8；
var isLeft=false；
var isRight=false；
var-isTop=false；
var isBottom=false；
var iAnchor；
canvas.onmousedown=handleMousedown；
canvas.onmousemove=handleMousemove；
canvas.onmouseup=handleMouseup；
canvas.onmouseout=handleMouseup；
函数绘制（带锚定、带边框）{
var cx=imageX+（imageRight-imageX）/2；
var cy=imageY+（imageBottom-imageY）/2；
clearRect（0，0，canvas.width，canvas.height）；
ctx.drawImage（img、imageX、imageY、imageRight-imageX、imageBottom-imageY）；
ctx.setLineDash（[10,15]）；
ctx.strokeStyle=“#000”；
ctx.stroke（）；
如果（带锚）{
ctx.fillRect（imageX，imageY，border，border）；
fillRect（imageRight-border，imageY，border，border）；
fillRect（imageRight-border，imageBottom-border，border，border）；
fillRect（imageX，imageBottom-border，border，border）；
ctx.fillRect（cx，imageY，border，border）；
fillRect（cx，imageBottom-border，border，border）；
ctx.fillRect（imageX，cy，border，border）；
fillRect（imageRight-border，cy，border，border）；
}
如果（带边框）{
ctx.beginPath（）；
ctx.moveTo（imageX，imageY）；
ctx.lineTo（imageRight，imageY）；
ctx.lineTo（图像右侧，图像底部）；
ctx.lineTo（imageX，imageBottom）；
ctx.closePath（）；
ctx.stroke（）；
}}
函数hitResizeAnchor（x，y）{
//鼠标下有哪些边框
isLeft=（x>imageX&&ximageRight-border）；
isTop=（y>imageY&&yimageBottom-border）；
//返回相应的锚点
if（isTop&&isLeft）{
返回（i方向+TL）；
}
如果（isTop&&isRight）{
返回（i方向+TR）；
}
if（isBottom&&isLeft）{
返回（i方向+BL）；
}
如果（isBottom&&isRight）{
返回（i方向+BR）；
}
如果（isTop）{
回报（“T”）；
}
如果（isRight）{
回报（“R”）；
}
如果（isBottom）{
申报表（“B”）；
}
if（isLeft）{
申报表（“L”）；
}
返回（“空”）；
}
var resizeFunctions={
T：函数（x，y）{
图像y=y；
canvas.style.cursor=“n-resize”；
},
R：函数（x，y）{
imageRight=x；
},
B：函数（x，y）{
imageBottom=y；
},
L：函数（x，y）{
imageX=x；
},
WideTR：函数（x，y）{
imageRight=x；
imageY=imageBottom-（imageHeight*（imageRight-imageX）/imageWidth）；
},
TallTR：函数（x，y）{
图像y=y；
imageRight=imageX+（imageWidth*（imageBottom-imageY）/imageHeight；
},
WideBR：函数（x，y）{
imageRight=x；
imageBottom=imageY+（imageHeight*（imageRight-imageX）/imageWidth）；
},
TallBR：函数（x，y）{
imageBottom=y；
imageRight=imageX+（imageWidth*（imageBottom-imageY）/imageHeight；
},
WideBL：函数（x，y）{
imageX=x；
imageBottom=imageY+（imageHeight*（imageRight-imageX）/imageWidth）；
},
TallBL：函数（x，y）{
imageBottom=y；
imageX=imageRight-（imageWidth*（imageBottom-imageY）/imageHeight）；
},
WideTL：函数（x，y）{
imageX=x；
imageY=imageBottom-（imageHeight*（imageRight-imageX）/imageWidth）；
},
TallTL：函数（x，y）{
imageBottom=y；
imageX=imageRight-（imageWidth*（imageBottom-imageY）/imageHeight）；
}
};
函数图像（x，y）{
返回（x>imageX&&ximageY&&y