python canvas画移动物体_HTML5 -canvas拖拽、移动 绘制图片可操作移动，拖动

关于canvas 的基础知识就不多说了，可以进这个网址学习

对于canvas 和 SVG 其实一开始个人是比较倾向于SVG多一点，不过后来工作需要，又学习了下canvas,

这两个之间主要不同是 canvas是在JavaScript中绘制，SVG则是在 XML 绘制

其实canvas 主要的工作就是绘制图像，图表之类的工作，对于一些可操作的特效个人还是更喜欢用canvas + div 来实现；

如果不是特别难的需求能做到尽量做

列出一个demo 这个主要功能就是canvas 内图片拖拽

(想要拖拽什么可以直接更换JavaScript 中第3、4、5句)；

说是拖拽，但也只是目测看起是 “像”是，其实在每次鼠标移动的时候都会先清掉之前画好的，再在鼠标所在的位置重新绘制一个，全套demo如下：

Title

body,div{

margin:0;

padding:0;

}

#d1{

width:500px;

height: 400px;

border: 2px solid #00FFD1;

}

您的系统不支持此程序!

const canva=document.getElementById("myCanvas");

const cansText=canva.getContext("2d");

let img = new Image();

img.src="http://www.w3school.c