[svgwg] Right to left text on path and trailing text. (#898)

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

== Right to left text on path and trailing text. ==
I've been doing tests, and this time, I found a problem with right-to-left textPaths, in particular when there's a trailing non-text-chunk piece of text. If we take the following SVG:

```
<svg width="230px" height="170px"
    xmlns="http://www.w3.org/2000/svg" version="2.0">
    <defs>
    <path id="path-horizontal" transform="translate(50, 0)" d="M0 0C10 20 50 20 60 0" />
    <path id="path-horizontal2" transform="translate(-20, 20)" d="M0 0C10 20 50 20 60 0" />
    <path id="path-vertical" transform="translate(0, 50)" d="M0 0C20 10 20 50 0 60" />
</defs>
<g id="testRect">

    <text id="test1" transform="translate(20,50)"
          font-family="DejaVu Sans" fill="blue" font-size="15">Lorem <textPath href="#path-horizontal">ipsum dolor sit </textPath>amet</text>
    
    <text id="test1rtl" transform="translate(90,100)"
          font-family="DejaVu Sans" fill="blue" font-size="15" direction="rtl">اللغة العربية<textPath href="#path-horizontal2" startOffset="100%"> المعيارية </textPath>الحديثة
    </text>
    
    <text id="test1ttb" transform="translate(200,10)"
        font-family="sans" fill="blue" font-size="15" 
          writing-mode="vertical-rl">ああ&#x82A6;<textPath href="#path-vertical">&#x82A6;&#x82A6;&#x82A6;あ</textPath>ああ&#x82A6;
    </text>

</g>

</svg>
```

Chromium 106:
![image](https://user-images.githubusercontent.com/1759191/198879799-9c7da32e-ed8f-483d-ac96-7ff3c5930ecb.png)

My code currently gives this:
![image](https://user-images.githubusercontent.com/1759191/198879895-d9191d73-4969-49df-97d2-a04f178d1ca8.png)

Chromium's result looks correct, however, this is the text-flow:
![image](https://user-images.githubusercontent.com/1759191/198879915-a68d731f-b4bf-4b27-9ab0-c512d1c910a5.png)

I think this is what is expected, but it's wrong because algorithm-wise that's the start of the path:

![image](https://user-images.githubusercontent.com/1759191/198879958-afa155bf-e3b9-47ed-a522-6d1ff2c2e518.png)

So, the [spec says that trailing text](https://svgwg.org/svg2-draft/text.html#TextpathLayoutRules) should be anchored to the end of the path:

> After positioning all characters within the ‘[textPath](https://svgwg.org/svg2-draft/text.html#TextPathElement)’, the [current text position](https://svgwg.org/svg2-draft/text.html#TermCurrentTextPosition) is set to the end point of the path, after adjusting for the ‘[startOffset](https://svgwg.org/svg2-draft/text.html#TextPathElementStartOffsetAttribute)’ in the case of paths that are a single closed loop. In other words, text that follows a ‘[textPath](https://svgwg.org/svg2-draft/text.html#TextPathElement)’ element (but is still inside a ‘[text](https://svgwg.org/svg2-draft/text.html#TextElement)’ element) that does not have explicit positioning information (‘[x](https://svgwg.org/svg2-draft/text.html#TextElementXAttribute)’ and ‘[y](https://svgwg.org/svg2-draft/text.html#TextElementYAttribute)’ attributes) is positioned from the end of the path.

There's another issue related to this: Every implementation I tried will not show right-to-left text with `text-anchor="start"` unless the startOffset is 100%, this is because the anchoring algorithm moves a right-to-left text to have it's positions in the negative of it's anchoring point, so it's not visible on a path to begin with.

My gut tells me that right-to-left text should have the end and start of a path flipped (but not the path itself flipped, because then it results in the effects of the 'side' attribute), though I am unsure how that would look algorithmically.


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


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

Received on Sunday, 30 October 2022 13:14:09 UTC