Il me semble normal que les dimensions soient accessibles une fois le composant affiché et pas avant.
c’est à dire tout son contenu parcouru une fois pour connaitre la taille de chaque libellé, bordure…
Le hook front onDrawNode
sert à surcharger les propriétés avant affichage, afficher par défaut ou en spécifique, puis faire ce que vous voulez une fois affiché.
Au plus simple commencez par débugger la taille après le display :
onDrawNode: function(n, display) {
display();
console.log("nw = " + n.w);
console.log("nh = " + n.h);
var s = n.size(); // recalcul de la taille suivant le border s'il existe
console.log("sw = " + s.w);
console.log("sh = " + s.h);
// changer de taille
n.size(200,200);
}
Exemple dans le Démo où un Produit est remplacé par son image, et la commande est affichée par défaut :
// Synchronous rendering
onDrawNode: function(n, display) {
var self = this, pad=10,
elt = Simplicite.Diagram.createElement;
var imgField = self.template.imgFields[n.object];
if (imgField && n.data) {
// Border
var b = n.border = elt("rect", { x:0, y:0, width:0, height:0 });
b.addClass("border").appendTo(n.elt);
n.radius && b.attr({ rx: n.radius, ry: n.radius });
if (n.shadow) b.attr("filter","url(#shadow)");
else b.removeAttr("filter");
n.bind(b);
// Picture
var x = pad,
imgId = n.data[imgField],
imgName = "pict_"+n.object+"_"+n.id;
if (imgId) {
self.desktop.getDefImage(imgName, 50, 0)
.appendTo(n.elt)
.attr({ x:x, y:pad });
x += 50+pad;
}
// Product infos
elt("text", { x:x, y:pad, dy:"1em"}).text(n.label).appendTo(n.elt).css("font-weight", "bold");
if (n.object=="DemoSupplier") {
elt("text", { x:x, y:pad, dy:"2em"}).text(n.data.demoSupName).appendTo(n.elt);
} else if (n.object=="DemoProduct") {
elt("text", { x:x, y:pad, dy:"2em"}).text(n.data.demoPrdName).appendTo(n.elt);
elt("text", { x:x, y:pad, dy:"3em"}).text("Unit price: "+n.data.demoPrdUnitPrice).appendTo(n.elt);
}
// Set final size of border
var box = n.elt[0].getBBox();
n.size(box.width + pad*2, box.height + pad*2);
} else { // Default drawing for other objects
display();
}
}