小飞机静止位于上下左右中 body{ text-align canvas{ background 您的浏览器不支持canvas标签！ ); Image(); p2.src ; console.log(p2.width); p2.onload = function(){ ctx.drawImage(p2,); ctx.drawImage(p2,); ctx.drawImage(p2,p2.height); ctx.drawImage(p2,p2.height); ctx.drawImage(p2,); } 左右移动的小飞机 body{ text-align canvas{ background 您的浏览器不支持canvas标签！ ); Image(); p3.src ; console.log(p3.width); p3.onload = function(){ ; ; ; setInterval(function(){ ); ctx.drawImage(p3,x,y); x xDirection; p3.width){ xDirection ; } ){ xDirection = 1; } },30); } 随鼠标移动的小飞机 body{ text-align canvas{ background 您的浏览器不支持canvas标签！ ); Image(); p3.src ; console.log(p3.width); p3.onload = function(){ ; ; (e){ x = e.offsetX; y = e.offsetY; }; (){ ctx.clearRect(); ctx.drawImage(p3,x); },20); } 以指定点为轴中心旋转的小飞机 body{ text-align canvas{ background 您的浏览器不支持canvas标签！ ); Image(); p2.src ; console.log(p2.width); p2.onload = function(){ ; ; setInterval(function(){ ); ctx.rotate(deg1); ctx.rotate(); deg1 += 10; ); ); ctx.rotate(deg2); ctx.rotate(); deg2 += 20; },50) } 以指定点为轴中心旋转的小飞机 body{ text-align canvas{ background 您的浏览器不支持canvas标签！ ); Image(); p2.src ; console.log(p2.width); p2.onload = function(){ ; ; setInterval(function(){ ctx.save(); ctx.translate(); ctx.rotate(deg1); ctx.restore(); deg1 += 10; ); //绘制飞机3——绕自己为中心选转，速度是飞机1的2倍 ctx.save(); ctx.translate(); ctx.rotate(deg2); ctx.restore(); deg2 += 20; },50) }