Kozea / Kozea/CairoSVG

Incorrect output when tspan combined with middle/end anchor

Open
#317 1 comment 7 reactions 0 assignees View on GitHub
bug
Dominant language
Python
Stars
951
Forks
166
PR merge metrics
No merged PRs in 30d

Description

Hi. There seems to be a bug in how CairoSVG renders a tspan contained inside text that is not left-anchored. Here's an example svg:

```svg

```

Here's the expected output:
![anchor_tspan_expceted](https://user-images.githubusercontent.com/4412666/110981759-eadaa580-8367-11eb-90e4-65dd9e58604d.png)

Here's CairoSVG's actual output:
![anchor_tspan_actual](https://user-images.githubusercontent.com/4412666/110981800-fc23b200-8367-11eb-8ddf-1e6a59a599fc.png)

Is this a known bug? I couldn't find a previous report of this.

I've had a look through the code, and it seems like a difficult thing to fix. In this case, it seems that the sentence is rendered as three separate chunks (it's treated as three nodes): "This is center-anchored", "italic", and "text". When the first chunk is positioned, it needs to account for the width of the subsequent two chunks, and then some kind of offset needs to be passed to the subsequent chunks to position them correctly. My hunch is that, in order to do this properly, you need a kind of "pre-rendering" stage, where you figure out the width of the full text element before handling each node separately. Or do you think there could be some simpler ways to fix this?

Contributor guide

No contributing guide indexed for this repository

Research direction

Start by reproducing the provided SVG with CairoSVG and tracing how text, tspan, and text-anchor are rendered. Compare the middle- and end-anchored output with the expected images; done means tspan-containing text aligns correctly without regressing the start-anchored case.

Written by the indexing model from the issue text.

Assessment

Tech stack
python
Domain
computer-graphics
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.