Skip to content

Instantly share code, notes, and snippets.

Created November 11, 2011 16:32
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save anonymous/371b8feb9442e4024b57 to your computer and use it in GitHub Desktop.
Save anonymous/371b8feb9442e4024b57 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<body>
<canvas id="myCanvas" width="200" height="100" style="border:1px solid #c3c3c3;">
Your browser does not support the canvas element.
</canvas>
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
var grd=cxt.createLinearGradient(0,0,256,0);
var stops = {
0.00: 0xFFFFFF00,
0.40: 0xFF0000ff,
0.60: 0xFF0000ff,
0.80: 0xFF0000ff,
1.00: 0xFF0000ff
};
for (var i in stops) {
grd.addColorStop(i, 'rgba(' +
((stops[i] >> 24) & 0xFF) + ',' +
((stops[i] >> 16) & 0xFF) + ',' +
((stops[i] >> 16) & 0xFF) + ',' +
((stops[i] >> 0) & 0xFF) + ')');
}
cxt.fillStyle=grd;
cxt.fillRect(0,0,256,100);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment