[svgwg] [SVG 2] SVG is missing declaration to center embedded content around arbitrary point (#909)

SetTrend has just created a new issue for https://github.com/w3c/svgwg:

== [SVG 2] SVG is missing declaration to center embedded content around arbitrary point ==
Currently, it's not possible to center arbitrary external entities around some arbitrary point in the SVG.

### Here is a living example:

People may want to upload arbitrary images to a website. These images may have different aspect ratios. The SVG data is supposed to be scalable, so all position/size values are given in percent. The image is supposed to have a margin.

The result is supposed to look like this:

![1](https://i.stack.imgur.com/ECmwc.png)
![1a](https://user-images.githubusercontent.com/9283914/226570596-77417f06-9b5c-490e-8881-0d10778c96a8.png)
![2](https://i.stack.imgur.com/uOfAU.png)

### Current Situation

Creating an SVG file that will display arbitrary external content with unknown aspect ratio centered around some point in the SVG file is not possible.

### Desired Situation

Add two new attributes to external entities, like `<svg>` or `<image>`:

- `horizontal-align`
- `vertical-align`

And have external entities' `x` and `y` attributes define the corresponding anchor point (depicted below in red):

![External entity alignment](https://user-images.githubusercontent.com/9283914/226575033-fe1abc12-17d6-49bd-a46c-d66b8884b205.png)

```svg
<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%">
  <rect width="100%" height="100%" fill="#e44" />
  <image href="./image.png"
          width="68%"
          vertical-alignment="center"
          horizontal-alignment="center"
          x="50%"
          y="50%"
          />
</svg>
```



Please view or discuss this issue at https://github.com/w3c/svgwg/issues/909 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Tuesday, 21 March 2023 10:11:21 UTC