canvas画蜗牛

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
</head>
<body onload="draw()">
<canvas id="canvas" width="500" height="500"></canvas>
</body>
<script>
function draw(){
var canvas=document.getElementById("canvas");
if(canvas==null)
{return false;}

var context=canvas.getContext("2d");

context.fillStyle="#eeeeef";
context.fillRect(0,0,500,500);
context.translate(200,50);
context.fillStyle="rgba(255,0,0,0.25)";
for(var i=0;i<50;i++)
{
context.translate(25,25);
context.scale(0.95,0.95);
context.rotate(Math.PI/10);
context.fillRect(0,0,100,50);
}
//g1=context.createRadialGradient(0,0,20,200,200,80);
//g1.addColorStop(0,"rgb(255,255,0)");
// g1.addColorStop(0.3,"rgb(234,67,98)");
//g1.addColorStop(1,"rgb(89,67,98)");
//context.fillStyle=g1;
//context.fillRect(0,0,300,300);
}
</script>
</html>

原文地址:https://www.cnblogs.com/qiuchunxia/p/5815224.html