Text elements sometimes are displayed too far right

ygra commented 4 years ago

e.g.:

<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="10cm" height="3cm" viewBox="0 0 1000 300"
     xmlns="http://www.w3.org/2000/svg" version="1.1">
  <desc>Example text01 - 'Hello, out there' in blue</desc>

  <text x="250" y="150" 
        font-family="Verdana" font-size="55" fill="blue" >
    Hello, out there
  </text>

  <!-- Show outline of canvas using 'rect' element -->
  <rect x="1" y="1" width="998" height="298"
        fill="none" stroke="blue" stroke-width="2" />
</svg>

(from the examples of the SVG spec)

ygra commented 4 years ago

text.textContent appears to still have surrounding whitespace, which seems to be rendered as well.

We could strip that, but xml:space may need to be honored as well, if it's there.

ygra commented 4 years ago

xml:space handling, especially when declared on an ancestor, differs wildly between browsers. Implemented like the XML spec says it should work, though (i.e. attribute values can be inherited). Results thus differ a bit from browsers in the inherited case:

Chrome:

Firefox:

fskpf / svg2roughjs

Text elements sometimes are displayed too far right #8