加载jointjs图后,我想调整所有单元格(rect)的大小,使它们与具有较大文本的单元格具有相同的高度。
我设法立刻调整所有元素的大小,如下:
_.each(paper.model.getElements(), function(el) {
el.set({ size: { width: 170 , height: newHeight} })
})
在我的元素中,有像" Rect"等元素。以及我用" path"创建的一些形状。 当我设置新的大小时,使用" path"创建的元素不仅要调整大小,还要改变它们在Y轴上的位置。
任何想法为什么我的"路径"元素重新定位?
我的"路径"形状看起来像这样:
joint.shapes.basic.CustomShape = joint.shapes.basic.Generic.extend({
markup: '<g class="rotatable"><g class="scalable"><path/></g><text><tspan class="word1"></tspan> <tspan class="word2"></tspan></text></g>',
defaults: joint.util.deepSupplement({
type: 'my.CustomShape',
attrs: {
path : {d: 'M 0 20 L 17 50 0 80 100 80 100 20 z', fill: '#ffffd9', stroke: '#4d4d4d', width: 100, height: 60, 'stroke-width':'0.03em'},
text: { ref: 'path' , 'line-height': 24 },
'.word1': { 'font-size': 12, fill: '#58ab00', 'font-weight': 'bold', 'font-family': 'Arial, helvetica, sans-serif', 'x':'4em' , 'y' : '5em'},
'.word2': { 'font-size': 11, fill: '#000000', 'font-family': 'Arial, helvetica, sans-serif', 'x':'37', 'y' : '7.5em'}
}
}, joint.shapes.basic.Generic.prototype.defaults)
});
答案 0 :(得分:1)
我设法立刻调整所有元素的大小,如下所示:
_.each(paper.model.getElements(), function(el) {
el.set({ size: { width: 170 , height: newHeight} })
})
在我的元素中,有像&#34; Rect&#34;等元素。和我用&#34; path&#34;创建的一些形状。 当我设置新的大小时,使用&#34; path&#34;创建的元素不仅要调整大小,还要改变它们在Y轴上的位置。
任何想法为什么我的&#34;路径&#34;元素重新定位?
我的&#34;路径&#34;形状看起来像这样:
joint.shapes.basic.CustomShape = joint.shapes.basic.Generic.extend({
markup: '<g class="rotatable"><g class="scalable"><path/></g><text><tspan class="word1"></tspan> <tspan class="word2"></tspan></text></g>',
defaults: joint.util.deepSupplement({
type: 'my.CustomShape',
attrs: {
path : {d: 'M 0 20 L 17 50 0 80 100 80 100 20 z', fill: '#ffffd9', stroke: '#4d4d4d', width: 100, height: 60, 'stroke-width':'0.03em'},
text: { ref: 'path' , 'line-height': 24 },
'.word1': { 'font-size': 12, fill: '#58ab00', 'font-weight': 'bold', 'font-family': 'Arial, helvetica, sans-serif', 'x':'4em' , 'y' : '5em'},
'.word2': { 'font-size': 11, fill: '#000000', 'font-family': 'Arial, helvetica, sans-serif', 'x':'37', 'y' : '7.5em'}
}
}, joint.shapes.basic.Generic.prototype.defaults)
});
谢谢!