新しい要素を定義しましたが、サイズを変更するときに問題が発生しました。パスが四角形で拡大縮小されません! どうすればいいですか、ルート要素のビューポートを試したり、スケーラブルなクラスを追加したりするなど、いくつかのオプションを試しましたが、何も機能しませんでした!
joint.dia.Element.define('custom.Rectangle', {
attrs: {
body: {
refWidth: '100%',
refHeight: '100%',
strokeWidth: 2,
stroke: 'red',
fill: '#FFFFFF'
},
label: {
textVerticalAnchor: 'middle',
textAnchor: 'middle',
refX: '50%',
refY: '50%',
fontSize: 14,
fill: '#333333'
},
topLine: {
resize:true,
stroke: 'gray',
strokeWidth: 2,
d:'M 0 0 L 86 0',
transform:'matrix(0.800000011920929,0,0,1,8.6,14.3)',
}
}
}, {
markup: [{
tagName: 'rect',
selector: 'body',
}, {
tagName: 'text',
selector: 'label'
}, {
tagName: 'path',
selector: 'topLine',
}]
});