vinothpandian/react-sketch-canvas

Bug when exporting with background image

belugawhale3 opened this issue · 1 comments

belugawhale3 commented

Describe the bug
If you export the background image the background picture will not scale correctly.

To Reproduce
Steps to reproduce the behavior:

  1. Go to https://vinoth.info/react-sketch-canvas/

  2. Use any image url for the background image (for example: https://upload.wikimedia.org/wikipedia/en/d/d4/Mickey_Mouse.png)

  3. click export image

  4. Background image is not exported with correct scale shown on canvas
    image

  5. Set xMinYMin for preserveBackgroundImageAspectRatio

  6. click export image

  7. Background image is broken
    image

Expected behavior
Image should export like so when not using preserve background image ratio
image

Image should export like so when using xMinYmin
image

Desktop (please complete the following information):

  • Windows
  • Chrome
belugawhale3 commented

I think I found the fix, react canvas has trouble reading from blob url, if you pass it as a data url instead it works correctly.