Background image is lost when saving as .svg

[Lonami]

It's possible to embed images on .svg files, as the following "example" shows:

<image
    y="0"
    x="0"
    xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgA…"
    preserveAspectRatio="none"
    height="568"
    width="512" />

This is what inkscape saves.

[Lonami]

And encoding as base64 can be done as follows (courtesy of Stack Overflow):

// Get the bytes array
ByteArrayOutputStream byteArrayOutputStream = new ByteArrayOutputStream();  
bitmap.compress(Bitmap.CompressFormat.PNG, 100, byteArrayOutputStream);
byte[] byteArray = byteArrayOutputStream .toByteArray();

// Encode the bytes into base64
String encoded = Base64.encodeToString(byteArray, Base64.DEFAULT);

[cbertelli]

I would prefer the linked object without the Base64 string. Il could at least help making the SVG the same size as the background image if there are no drawings outside it (meaning that the user is annotating the photo). By the way, I would store the annotations in a database if allowed.

[Lonami]

I would prefer the linked object without the Base64 string

If we use an absolute path, I think the .svg would be pretty useless once you move it out from the phone/tablet. If we use a relative path (or maybe just the name), then we need to store this mapping somewhere. I think it would be a tad bit trickier.

[cbertelli]

I would prefer something like the linked object in Inkscape:

    <image
       sodipodi:relref="IMG_20160708_231027.jpg"
       xlink:href="IMG_20160708_231027.jpg"
       y="462.69064"
       x="7.4576993"
       id="image1419"
       preserveAspectRatio="none"
       height="607.5"
       width="1080"
       style="image-rendering:auto" />

Anyway the problem is retaining the image position o using a canvas the same size as the picture if there are no drawings outside.

[cbertelli]

If you do like Inkscape does and resize the canvas size, the use case becomes maybe too specific, but easy to solve. Maybe the xlink:href is enough.