2

I am trying to resize the shapes of the nodes to the size of the node text. I followed instructions from https://github.com/cytoscape/cytoscape.js/issues/649 . However:

  1. The shapes always end up with height = width
  2. The size of all shapes is the same.
  3. The shape size seems to reach a max above which it can't grow.

(I am not sure if this has something to do with dagre layout.)

I am using the following libraries with the dagre layout:

  • cytoscape.min.js
  • dagre.min.js

  • cytoscape-dagre.js

    container: document.getElementById('cy'),
boxSelectionEnabled: false, autounselectify: true,

layout: {name: 'dagre', rankDir: 'LR', align: 'LR'},

style: [{
    selector: 'node',
    style: {
        'content': 'data(name)',
        'label': 'data(name)',
        'text-opacity': 1,
        'text-valign': 'center',
        'text-halign': 'center',
        'text-wrap': 'wrap',
        'font-size': 9,
        'background-color': '#AAA',
        'shape':'rectangle',
        'width': 'data(width)' * 50,
        'height': 'data(height)' * 50 }
},{
    selector: 'edge',
    style: {
        'width': 4,
        'content': 'data(name)',
        'target-arrow-shape': 'triangle',
        'line-color': 'data(color)',
        'text-wrap': 'wrap',
        'target-arrow-color': 'data(color)',
        'font-size': 10,
    }
}]
Erik Kaplun
  • 37,128
  • 15
  • 99
  • 111
Marcus
  • 161
  • 1
  • 2
  • 12

1 Answers1

0

You've specified invalid style. "somestring" * 50 is NaN.

You want width: label, as indicated in the docs: http://js.cytoscape.org/#style/node-body

maxkfranz
  • 11,896
  • 1
  • 27
  • 36
  • Thanks Max. It works now. I was searching this site but somehow overlooked that section. This helps a lot. Thanks again. – Marcus Feb 10 '16 at 09:56
  • That property is deprecated: "The style value of `label` is deprecated for `width`" – Clément Oct 24 '20 at 07:24