canvas 的線性漸變
阿新 • • 發佈：2018-11-29
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<canvas id="canvas">
</canvas>
</body>
</html><script type="text/javascript"> /* fillStyle 不僅可以填充顏色還可以填充漸變色 var grd = context.createLinderGradident(x,start,ystart,xend,yend); grd.addColorStop(stop,color); */ var canvas = document.getElementById('canvas'); canvas.width = 800; canvas.height = 800; var context = canvas.getContext('2d'); var grd = context.createLinearGradient(400,800,400,0); grd.addColorStop(0.0,'#fff'); grd.addColorStop(1.0,'#000'); context.fillStyle = grd; context.fillRect(0,0,800,800); </script>
