Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
<canvas id="canvas">canvas unsupported</canvas>
<script type="text/JavaScript">
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
canvas.width = 256;
canvas.height = 256;
var dst = ctx.createImageData(canvas.width, canvas.height);
for (var i = 0; i < canvas.height; i++) {
for (var j = 0; j < canvas.width; j++) {
var pix = (i*canvas.width + j) * 4; // i-j Coordinate
dst.data[pix] = i; // Red
dst.data[pix+1] = 0; // Green
dst.data[pix+2] = 0; // Blue
dst.data[pix+3] = 255; // Alpha
}
}
ctx.putImageData(dst, 0, 0);
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment