W3C home > Mailing lists > Public > www-svg@w3.org > November 2013

Re: Automatic centering and positioning

From: Jeremie Patonnier <jeremie.patonnier@gmail.com>
Date: Fri, 8 Nov 2013 11:18:30 +0100
Message-ID: <CAEi838nw81XTpwRk85smUP=+Mhb-gdUGePRuV-PpkY0CyYPq4Q@mail.gmail.com>
To: Paul LeBeau <paul.lebeau@gmail.com>
Cc: www-svg <www-svg@w3.org>
Yes, I face the same kind on question on a regular basis.

>From my understanding, most of the developer just do not understand that
the positioning model of SVG and HTML is different (based on absolute
position for SVG and on the flow for HTML)

As Tab remind us, Doug suggested that being able to nest element is a
possible answer. I'm more in favor of making SVG more friendly with CSS
proposal such as Grid and Exclusion. As Grid is a way to get rid of the
flow within HTML, it suits very well with SVG (where flexbox is harder to
use as it relay on the flow of HTML element on many points and it induces a
lot of questions regarding what is a flexible unit in an SVG document). In
the same idea, Exclusion provide a good entry point to understand what flow
means for SVG elements.

But the hardest part is that in many case question circle around basic
closed shapes (rect, circle, polygon, etc.). It become very messy when it
hit some edge cases on SVG :

   - What is the inside and outside of an open shape?
   - What is the inside and outside of multiple shapes drown through a
   single path element?
   - What is the inside and outside of a line or a point?
   - etc.

Some of those questions are answered with the fill-rule property but not
all of them.

So moving SVG from absolute positioning to flow positioning is not that
simple and it will require time (and hard implementation work).

In the mean time we are stuck with what we have.


2013/11/7 Paul LeBeau <paul.lebeau@gmail.com>

> Hi all
> I have spent a bit of time on Stack Overflow lately, answering questions
> on SVG.  It seems a very common use case that people want to centre
> elements inside other elements.  For example, text in a circle, image in a
> box.
> I have been wondering if this use case has been discussed before and
> whether there were any previous proposals or interest in adding some sort
> of feature that can automatically position elements with respect to a box
> or other element.
> Obviously you can achieve some control with child <svg>s and the text
> baseline properties, but these can be hard to use and can require manual
> tweaking.  Something automatic would be nice.
> I had an idea or two about how you could do this, but wanted to check
> whether other people agree it would be desirable (or not).
> Paul

Web : http://jeremie.patonnier.net
Twitter : @JeremiePat <http://twitter.com/JeremiePat>
Received on Friday, 8 November 2013 10:19:41 UTC

This archive was generated by hypermail 2.4.0 : Friday, 17 January 2020 22:54:47 UTC