Thursday, August 10, 2017

Canvas .toDataURL() returns partially corrupted image

Leave a Comment

We have a web application that (very intermittently) is returning a partially corrupted PNG image data URL. The image has a large black section covering some of the image but not all of it. These images are customer signatures.
For example:

enter image description here

We are using the signature pad component from this. The image URL is returned using the getSignatureImage() routine.

The only thing I have seen from the access logs seems to show the affected requests coming from "Samsung Galaxy Tab" devices, but using Chrome 59. However other requests from the same devices work OK.

Any help appreciated.

1 Answers

Answers 1

I think it is not a memory issue. When image consumes too much memory, an image will by simply black (empty pixels rgb(0,0,0)). Try to get blob from canvas - canvas.toBlob(function(blob) {}). Probably your image not loaded or draw yet. Try to put window.setTimeout somewhere before you get the image data (base64 or blob)

If You Enjoyed This, Take 5 Seconds To Share It

0 comments:

Post a Comment