Cytoscape.js - Erstellen Sie kreisförmige Knoten mit der Größe

Question

In Cytoscape möchte ich Knoten, die kreisförmig sind, mit dem Durchmesser abhängig von der Knotenbezeichnung erstellen (die Beschriftung ist im Knoten zentriert). Ich habe folgendes festgelegt:

style: { 
    'shape': 'ellipse', 
    'width': 'label' 
} 

Wie erhalte ich die Höhe von der Breite Wert abzuhängen? 'Höhe' einstellen: 'Etikett' setzt die Höhe auf die Höhe des Etiketts.

Answer 1

Wenn Sie eine Schrift mit fester Breite verwenden können, dann @ Antwort BeerBaron die am besten ist.

Alternative gibt es das Sheet Sie haben im OP:

style: { 
    'shape': 'ellipse', 
    'width': 'label', 
    'height': 'data(height)' 
} 

aktualisieren Knotenhöhen als Schritt post-init, z.B.

cy.nodes().forEach(function(n){ n.data('height', n.width()); }); 

Sie wahrscheinlich data.height für jeden Knoten zu einem gewissen Standardwert bei init voreingestellt sollten das Debuggen zu erleichtern (zum Beispiel, wenn Sie später neuen Knoten hinzufügen).

Answer 2

Je nach Labellänge und Schriftart können Sie Breite und Höhe im JavaScript-Teil festlegen, der Knoten an das Diagramm anfügt, und den Rest des Styles der Initialisierung der Engine überlassen.

Zum Beispiel:

cy.add({ 
     group: 'nodes', 
     style: { 
      height: (10*label.lenght), 
      width: (10*label.lenght), 
     } 
    })