1

So I'm rendering some objects with specific width of 120px and the objects will have different titles. My problem is when the title is too long it doesn't wrap it and put it in a new line. Is there a work-around this kind of issue in svg?

var labels = ["Testing 123", "Things are fantastic"]

for (var i = 0; i < labels.length; i++)
            {
                cell = editor.graph.cloneCells([cell])[0];
                // cell.setStyle(new-style);
                editor.graph.model.valueForCellChanged(cell, label);

                editor.toolbar.addPrototype(label, "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' height='43px' width='104px'>" +
                    "<rect fill='#595A5A' stroke='black' x='0' y='0' rx='5' ry='5' width='100%' height='100%'/>"+
                    "<text text-anchor='middle' font-weight='600' font-family='Helvetica' fill='#BCCF00' x='50%' y='25' font-size='12'>" + label + "</text></svg>", cell);
            }
nCore
  • 2,027
  • 7
  • 29
  • 57

1 Answers1

3

There is no automatic text wrapping in SVG 1.1. You need to layout your text into lines yourself.

Paul LeBeau
  • 97,474
  • 9
  • 154
  • 181
  • Are you confirming that even in normal svg, we cant break line; Is there possibility of putting the text tag in a box which could contain the text, instead of hide the overflowed – Abel Jojo Jul 06 '17 at 15:20
  • 1
    Generic SVG 1.1 has no wrapping ability. That is likely to change in SVG 2 when it is released. However, if you are in a browser, you can make use of the `` element to [embed HTML inside your SVG](https://developer.mozilla.org/en/docs/Web/SVG/Element/foreignObject). That is your only option. – Paul LeBeau Jul 06 '17 at 17:33