Skip to content

Instantly share code, notes, and snippets.

@frostney
Last active January 1, 2016 11:49
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 frostney/8140201 to your computer and use it in GitHub Desktop.
Save frostney/8140201 to your computer and use it in GitHub Desktop.
Simple texture loader in JavaScript using HTML5 canvas elements
texturize = (url, callback) ->
image = new Image()
image.src = url
image.onload = ->
canvas = document.createElement 'canvas'
context = canvas.getContext '2d'
canvas.width = image.width
canvas.height = image.height
context.drawImage context, 0, 0
{width, height} = image
imageData = canvas.getImageData 0, 0, width, height
pixels = []
for y in [0..width]
for x in [0..height]
pixels[x] or= []
pixels[x][y] =
r: imageData.data[x * y]
g: imageData.data[x * y + 1]
b: imageData.data[x * y + 2]
a: imageData.data[x * y + 3]
callback
width: width
height: height
src: url
pixels: pixels
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment