Issue Title:

Fixes issue #519

Type of change ☑️

What sort of change have you made:

[x] Bug fix (non-breaking change which fixes an issue)
[ ] New feature (non-breaking change which adds functionality)
[ ] Code style update (formatting, local variables)
[x] Breaking change (fix or feature that would cause existing functionality to not work as expected)
[ ] This change requires a documentation update

[x] My code follows the guidelines of this project.
[x] I have performed a self-review of my own code.
[x] I have commented my code, particularly wherever it was hard to understand.
[ ] I have made corresponding changes to the documentation.
[ ] My changes generate no new warnings.
[x] I have added things that prove my fix is effective or that my feature works.
[ ] Any dependent changes have been merged and published in downstream modules.

Initially, the conversion function used a custom context-based serialization (ctx.getSerializedSvg()), which was not working correctly, as the SVG output did not accurately reflect the canvas content, leading to a blank or incorrectly rendered SVG.
I replaced the approach by directly using the canvas's toDataURL("image/png") method to create an image element within the SVG.
Tested the updated code by generating SVG files and opening them in multiple browsers to ensure that the canvas content was centered and correctly displayed.
Verified that the issue with the canvas being only horizontally centered but not vertically centered was fixed by adjusting the offsets.
Confirmed that the final SVG output matched the appearance of the canvas, with the content fully visible and centered.