Text in SVG

General JUCE discussion
1

I received several SVG’s with text from my graphics designer and none of them display their embedded text. I debugged the parsing of the SVG’s in JUCE a bit and I can see sections referring to text there. Is this supposed to work? Or are there certain requirements to this?

This is such a SVG:

<svg xmlns="http://www.w3.org/2000/svg" width="160" height="145" viewBox="0 0 160 145">
  <g id="Group_11" data-name="Group 11" transform="translate(-117 -752)">
    <g id="Group_2" data-name="Group 2" transform="translate(-960)">
      <g id="Rectangle_6" data-name="Rectangle 6" transform="translate(1077 752)" fill="#2b2c2b" stroke="#020202" stroke-width="3">
        <path d="M0,0H160a0,0,0,0,1,0,0V135a10,10,0,0,1-10,10H10A10,10,0,0,1,0,135V0A0,0,0,0,1,0,0Z" stroke="none"/>
        <path d="M3,1.5H157A1.5,1.5,0,0,1,158.5,3V135a8.5,8.5,0,0,1-8.5,8.5H10A8.5,8.5,0,0,1,1.5,135V3A1.5,1.5,0,0,1,3,1.5Z" fill="none"/>
      </g>
      <path id="Path_2" data-name="Path 2" d="M0,0H3V138a7.433,7.433,0,0,1-3.026-5.354C-.405,128.962,0,0,0,0Z" transform="translate(1080 755)" fill="#525252" opacity="0.369"/>
      <text id="ARP" transform="translate(1126 834)" fill="#bdbdbd" font-size="40" font-family="Teko-Bold, Teko" font-weight="700"><tspan x="0" y="0">ARP</tspan></text>
    </g>
  </g>
</svg>
1 Like
2

Ask them to render the text to paths prior to export.

I either do this or (if the result is too big or I want dynamic text) remove the text and use Labels or g.drawText methods instead.

3

Well, of course I can draw the texts myself, but that wasn’t the question.

1 Like
4

I’ve never got it to work but I didn’t try too hard as converting text to paths did the trick.

IIRC, the problem I had was related to getting the right font.
Perhaps check that your LookAndFeel is serving the right font? I’m assuming that this delegates to that at some point either during the parsing or the final drawing.

5

IIRC, that was the problem. It set up the font styles, but never assigned the actual font. It just seemed like a bug/uncompleted feature.

6

We have SVGs with text elements and they work fine.

In JUCE’s SVG support in general sometimes things worked weird and there were bugs. I’d try simplifying the SVG to more basic sanity-tests to get to the root of the problem

7

It’s probably this bug.
Can you check if this still happens in develop?

best,
Ben

1 Like
8

Thanks. The texts actually show up when using the change in that thread. However, it doesn’t seem to use the right font and/or font style.

9

Hey @DaveAE did you find out how to get the correct font to show without using “rendering text to paths”?

10

I’m afraid not. I ended up drawing the texts myself.