What I’m trying to do:
The ideal would be to allow Canvas.get_image() to accept x, y, width, height parameters, to return a valid Media object from only the specified region. For example, the raw HTML Canvas accepts these parameters to getImageData().
In the absence of that, I’m trying workarounds but have yet to be successful.
What I’ve tried and what’s not working:
I have checked to see if using Canvas.clip() after specifying a path around the area of interest affects the output of Canvas.get_image(), but it does not appear to do so. The result is a successful Media object, but containing the whole Canvas surface.
I have also tried creating a new Canvas object (not inserted into the DOM) that is the correct size, and drawing the desired area into the new Canvas using draw_image_part():
Code Sample:
temp_canvas = Canvas(width=width, height=height)
temp_canvas.draw_image_part(dom_canvas.get_image(), x, y, width, height, 0, 0, width, height)
media_obj = temp_canvas.get_image()
however, while media_obj in the snippet above is a URLMedia object, when trying to pass it to a server function I get the following error:
ExternalError: InvalidCharacterError: Failed to execute 'atob' on 'Window': The string to be decoded is not correctly encoded.
which suggests to me that the internal representation of the data is invalid, perhaps None, and cannot be converted to the appropriate base64 encoded string data. This may be because the temporary Canvas object is not visible/inserted into the DOM and therefore reading the image data gets no valid value from the browser.
If anyone has done anything similar successfully I’d love to hear how you did it.