I have a QR code, but wounded, cannot be seen clearly. I want to put the wounded QR code as a background, and draw a new QR code on top of the background.

I also want to do some test to JavaScript canvas drawing. So I created this blog with interactive drawing functionality. In order to test pure JavaScript, no library is used.

Instructions:

  1. Set rows, columns and grid size of the QR code drawing area.
  2. Browse a image file on local disk, it will show as a background and fit into to canvas with set sizes.
  3. Use left mouse button to draw dark points and right mouse button to clear dark points.
  4. Use Hide/Show button to hide or show background after background selected, respectively, also for further scanning.
  5. Below the drawing area, a textarea is shown to represent the two dimensional data.
  6. Click Set Data button to apply the data in the textarea to the drawing area if sizes match.


Rows: Cols: Grid size: