How can I limit or clip text in SVG?

Question

I have done a table in SVG, and I want to fill it with data dynamically. That means that I don\'t know how much space the text takes, and I want to clip or hide the overlapping

Answer 1

You can use clip-path to clip to whatever shape you want, see e.g masking-path-01 from the svg testsuite.

Relevant parts, defining the clip path:

  
  ... you can have any shapes you want here ...

and then apply the clip path like this:

  ... your text elements here ...