Open local image with HTML 5
Say you want to open an image and play with canvas but you don't want to upload the image. Well, you can use the HTML 5 FileSystem API.
function draw() {
var img = new Image(),
ctx = document.getElementById('canvas').getContext('2d'),
f = document.getElementById("uploadimage").files[0],
url = window.URL || window.webkitURL,
src = url.createObjectURL(f);
img.src = src;
img.onload = function() {
ctx.drawImage(img,0,0);
url.revokeObjectURL(src);
}
}
<input type='file' name='img' size='65' id='uploadimage' />
Written by Juan Pujol
Related protips
Have a fresh tip? Share with Coderwall community!
Post
Post a tip
Best
#Html
Authors
Sponsored by #native_company# — Learn More
#native_title#
#native_desc#