我正在研究JointJS。我在其中包含各种元素。但是,元素的宽度随文本的增加而增加。我想动态设置元素的大小,以使框可以达到最大高度和宽度,并通过自动换行来相应地扩展。如果文本不能适合最大高度和宽度元素,则可以动态减小字体大小。

我尝试在我的div ID中使用style="word-wrap: break-word;"。但是没有效果。

<div id="myholder" style="word-wrap: break-word;"> </div>

我的持有人在JS文件中的定义如下:var paper = new joint.dia.Paper({ el: $('#myholder'), width: 1200, height: 700, model: graph});我可以采取什么策略?

最佳答案

也可以(如果您不想打扰其他形状)使用

joint.util.breakText()

效用。它是这样的:
var wraptext = joint.util.breakText('My text here', {
    width: holderElement.size.width,
    height: optionalHeight
});

之后,您可以在创建wraptext时将holderElement添加到attrs中。像这样:
var holder = joint.shapes.basic.Rect({
    //position, size blablabla
    attrs: {
        text: {
            text: wraptext,
            //text styling
        }
    }
});

我不得不说,您的持有人是整张纸,这有点奇怪,但是您可能可以以相同的方式使用它,只需在定义它时放入ojit_code。

10-04 10:06