多来a梦html代码,html5 canvas绘制哆啦A梦机器猫图形代码

  • Post author:
  • Post category:其他


特效描述:html5 canvas绘制 哆啦A梦 机器猫图形代码。html5 canvas利用画布绘制哆啦A梦

代码结构

1. HTML代码

window.οnlοad=function(){

var cxt=document.getElementById(‘canvas’).getContext(‘2d’);

cxt.beginPath();

cxt.lineWidth=1;

cxt.strokeStyle=”black”;

cxt.arc(200,175,175,0.7*Math.PI,0.3*Math.PI);

var head = cxt.createRadialGradient(260,25,8,200,175,175);

head.addColorStop(0,”white”);

head.addColorStop(1,”#16B3DC”);

cxt.fillStyle=head;

cxt.fill();

cxt.stroke();

//脸框

cxt.beginPath();

cxt.fillStyle=”white”;

cxt.moveTo(110,110);

cxt.quadraticCurveTo(-10,200,120,315);

cxt.lineTo(280,315);

cxt.quadraticCurveTo(410,210,290,110);

cxt.lineTo(110,110);

cxt.fill();

cxt.stroke();

//眼睛