textWrap in custom ElementView

[igo]

Hi, I am trying to create a custom ElementView where I will display an array of strings, one line per item. These strings should be truncated to the width of an element body and ended by '...'. However I did not yet figured out how to do this truncation. I tried this but it didn't work:

const vLabel = V('text').text('My very long text', { textVerticalAnchor: 'top' }).attr({ x: 10, y: y, width: 20, textWrap: { ellipsis: true, width: 20 } });

How can I set the maximal length of a text inside V('text') so that length will adopt to the element size?

[kumilingus]

You need to use the break text utility directly. Vectorizer.prototype.attr()does not recognize JointJS attributes (e.g. textWrap, ref, atConnectionLength).

const text = 'My very long text';
const textAttributes = { 'font-size': 15, 'font-family': 'sans-serif' };
const wrappedText = util.breakText(text, { width: 20, ellipsis: true }, textAttributes);
const vLabel = V('text').attr({ x: 10, y: y, ...textAttributes }).text(wrappedText, { textVerticalAnchor: 'top' });