RE: Using textLength with tspan children - browsers vary in how they render things.

Hi Thomas,

 

Firefox seems to be handling much of this now (it was the only way really to
make text content scalable!). In 2011 the examples at
http://srufaculty.sru.edu/david.dailey/svg/text/

worked about 95% in ASV, 100% in Opera, maybe 25% in Firefox; Chrome and
Safari were not really worth mentioning. I didn't play with <tspans> though.

 

Your experiments are quite informative!

 

Now Firefox is up to about 60% (handling the textLength and
lengthAdjust="spacingAndGlyphs" stuff correctly, but not doing so well on
some of the animates and, of course, displacement filter on backgrounds.
Opera has fallen back to about 20% (from the previous 100%) and I suppose
Chrome is in about the same boat. Apple doesn't let me test in Safari, but I
assume it is still pretty awful there for these sorts of things that only
artists and aerospace people use;)

ASV holds steady at about 95%.

 

I would assume that since the FF people seem to have touched this issue
relatively recently, that their implementation is pretty trustworthy.

 

Cheers

David

 

From: Smailus, Thomas O [mailto:Thomas.O.Smailus@boeing.com] 
Sent: Friday, May 16, 2014 6:15 PM
To: www-svg@w3.org
Subject: Using textLength with tspan children - browsers vary in how they
render things.

 

I've been working on a project that requires me to put text in tspan
children to a text element, in order to control changes in
font/font-size/color, etc for the various fragments.

However, I still need to be able to precisely define how long the text
element needs to be via textLength.

 

In working with IE 11 and Firefox 28, I found that the 2 browsers differ
substantially in how they implement the combination of the textLength and
the tspan functionality.

 

I've put together a jsFiddle to illustrate the issue.  Depending on if you
view this in IE or Firefox, you get different results:

http://jsfiddle.net/thomassmailus/pUavF/3/

 

There are 4 examples in the fiddle, from top to bottom

1.       textLength is specified as an attribute of the text element, the
various text are all in tspan children of the text

2.       textLength is not in the text element, but in the first tspan
child.

3.       No textLength specified at all (for reference only)

4.       PNG raster of what I am hoping is the target implementation when
case #1 is the specification

a.       The textLength is specified as attribute to <text />

b.      The various <tspan /> children to text as a whole, fill up the
extent defined by the textLength in the parent <text /> element.

 


It appears Firefox 28 implements the desired functionality.

What we see is that IE and FF differ in how they implement the effect whein
tspan and textLength are used in a <text /> element - the result is thus not
at all consistant and a problem for authors.

 

What are the thoughts of the community on expected behavior?

 

 

Thomas

--

Thomas Smailus, Ph.D.  P.E.

Boeing Information Technology

thomas.o.smailus@boeing.com