jeromeetienne / jquery-qrcode

qrcode generation standalone (doesn't depend on external services)
http://blog.jetienne.com/blog/2011/04/07/jquery-qrcode/
MIT License
4.84k stars 2.5k forks source link

Update jquery.qrcode.js to support Chrome & Opera #70

Open tamcloug opened 9 years ago

tamcloug commented 9 years ago

Update to determine actual canvas size based on pixel size and getModuleCount(). Canvas width and height options are used as a guideline to determine approximate resulting image size.

jeromeetienne commented 9 years ago

Thanks for your contributions!

the code seems clean. i dont understand the relation with chrome or opera tho. im no expert in qrcode. Another question, what is a module here ?

tamcloug commented 9 years ago

getModuleCount() was the existing function, it returns the number of tiles across / high that will be needed to generate the final QR Code. I'm not a QR Code expert either so I assume this was a recognized term and retained the convention.

The code defaults to a 256x256 final graphic size which originally was divided by the getModuleCount() to get the individual tile size. With one our our messages that being encoded, this resulted in 49 modules and a tile size of 5.22 pixels to make up the overall image size of 256px. When IE and Firefox process this they use 5px for the tile size and the override the overall image size for a final image that is 245px. Chrome and Opera try to honor the overall image size more than the individual tile size, resulting in every 5th column and 5th row being 6px wide / tall (all others are 5px), rendering an unscannable QR Code. One option is to set the final image size to 245px, but with a variable message length (we're encoding several messages at once dynamically), this would just shift the problem to somewhere else.

The changes I proposed take the 256px requested overall image size, divide that by columns / rows needed to encode the message (module), floor the result to an integer, then multiply that back to get the true final image size. In my case, 256px / 49 cols = 5.22px --> 5px tile size * 49 cols = 245px overall image size.

This issue was also reported by rasec as issue #31 (that defect was key in helping me figure out that the cell sizes were off). Hope this helps clear up my madness :-)