html5日志怎麼做,HTML5 Canvas 學習日志（五）

HTML5 Canvas 學習日志(五)

Canvas Gradient

var canvas = $("#mycanvas");var context = canvas.get(0).getContext("2d");var gradient = context.createLinearGradient(0, 0, 0, canvas.height());gradient.addColorStop(0, "rgb(255, 0, 0)");gradient.addColorStop(1, "rgb(255, 0, 255)");context.fillStyle = gradient;context.fillRect(0, 0, canvas.width(), canvas.height());

var radialX = canvas.width()/2;var radialY = canvas.height()/2;var gradient = context.createRadialGradient(radialX, radialY, 0, radialX, radialY, canvas.width()/2);gradient.addColorStop(0, "rgb(255, 0, 0)");gradient.addColorStop(1, "rgb(255, 255, 0)");context.fillStyle = gradient;context.fillRect(0, 0, canvas.width(), canvas.height());