leemeichin / say-cheese

Minimal javascript library for integrating a webcam and snapshots into your app.
http://leemachin.github.com/say-cheese
MIT License
550 stars 97 forks source link

Any way to shrink the snapshot/video size? #13

Closed cannikin closed 11 years ago

cannikin commented 11 years ago

I only need a little 100x100 snapshot from the webcam but I end up with a 640x480 screen every time and it's sometimes 500k in size. Is there any way to define a smaller canvas to get the dataURL from?

It seems like tweaking the video size in the .createVideo() method only changes the size of the video as displayed in the browser, but the snapshot is still the same 640x480. I'm guessing it's going to require some canvas magic?

Thanks, Rob

leemeichin commented 11 years ago

Check out the 'resize-snapshot' branch (https://github.com/leemachin/say-cheese/tree/resize-snapshot), which has a modified version of takeSnapshot that allows you to set a width and height.[1]

It's totally untested, and I'll consider merging it into master if it works as I expect. It might be a good starting point for what you want, though. It should change the size of the snapshot canvas element, and draw the image to be the same size. Some of the code may even be redundant (the extra two arguments to drawImage).

[1] https://developer.mozilla.org/en-US/docs/Canvas_tutorial/Using_images#Scaling

cannikin commented 11 years ago

That did it! I had tried sending in the two extra parameters to drawImage but not setting the canvas width/height to those same values to begin with. And it does look like you need to send those two extra parameters to drawImage, otherwise you just get a cropped photo.

Thanks man!

On Monday, November 26, 2012 at 1:16 PM, Lee Machin wrote:

Check out the 'resize-snapshot' branch (https://github.com/leemachin/say-cheese/tree/resize-snapshot), which has a modified version of takeSnapshot that allows you to set a width and height.[1] It's totally untested, and I'll consider merging it into master if it works as I expect. It might be a good starting point for what you want, though. It should change the size of the snapshot canvas element, and draw the image to be the same size. Some of the code may even be redundant (the extra two arguments to drawImage). [1] https://developer.mozilla.org/en-US/docs/Canvas_tutorial/Using_images#Scaling

— Reply to this email directly or view it on GitHub (https://github.com/leemachin/say-cheese/issues/13#issuecomment-10734220).