W3C home > Mailing lists > Public > www-svg@w3.org > October 2010

Formatting text with SVG

From: <kitfox@golden.net>
Date: Mon, 11 Oct 2010 03:42:57 -0400
Message-ID: <333d93948487ba9a4fd2ac01c965491e.squirrel@www.webmail.execulink.com>
To: www-svg@w3.org
I'm implementing my own SVG renderer.  I'm trying to work out how to
format text with <text> and <tspan> and finding it a real mind bender.

I've read the SVG spec a few times and experimented with Inkscape, which
I'm hoping is accurate.  My strategy so far is this:

-Iterate through all the children of the <text>.
	- If it's a text element, for each (x, y) coordinate specified, create a
new text-chunk with the text styling values of the <text> element.
	- If a <tspan>, push the current frame of (x, y) coords and start using
the (x, y) coords of the <tspan>.  If I run out of (x, y) coords, I can
keep going using the coords of the pushed frame until I run out of those
	-Each time I consume a text character, I record the current styling
options for that character as defined in the most recent tag.

I think this will partition my text into the correct number of text chunks
with the right styling on each chunk.  I'm not sure if this will work with
right-to-left text.

What happens if the x and y arrays have different numbers of elements? 
What if the user specifies both (x, y) and (dx, dy) arrays?  What if all
four arrays have different numbers of elements?

In Inkscape, it seems that adding (dx, dy) adjustments in some <tspans>
can affect the 'absolute' positioning of the (x, y) in the following
<tspan>.  Is this right?

Is this the right way to handle the mixing of text and <tspan> as children
of the same element?

At this point, each chunk should have one or more characters, each with
its own styling info.  I can then parse through each chunk looking for
consecutive characters with the same styling info.  If these characters
form a ligature, I can perform the substitution at this point.

Next, to layout each text chunk I position a virtual cursor at the origin
of that chunk.  I then go left-to-right (or right-to-left) and turn these
charcters into glyph shapes using their font and size properties.  For
each character/ligature I find and position the right glyph and then move
the cursor left (or right) by the horiz-adv-x of the glyph.  I also record
the stroke and fill information for the glyph for later.

Finally I apply the text-anchor.  This seems particularly strange since it
seems (at least in Inkscape) that text-anchor is relative to the first (x,
y) coordinate of the <text> element rather than the origin of the text
chunk.  Anyhow, it seems that I should now ignore the x coord of the text
chunk and instead translate all glyphs in the chunk so that either their
start, middle or end matches the first x coordinate of the root <text>
element.  However, the y coord of the text chunk is unchanged.

Anyhow, the arrays of (x, y) and (dx, dy) are making this really
confusing.  Inkscape seems to ignore the positioning info in a lot of
situations, and the (x, y) doesn't seem to be truely 'absolute'.

Does this sound right?  Is there some plain-english description of how to
render <text> with <tspans> correctly?


Powered by Execulink Webmail
Received on Monday, 11 October 2010 07:43:24 UTC

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