title: Make Cytoscape.js container just wide enough and just long enough
body: <p>I am rendering several tree layouts in separate canvases using <a href="http://js.cytoscape.org/" rel="nofollow noreferrer">Cytoscape.js</a>.</p>
  
  <p>Currently, each canvas is enveloped by a container div with set dimensions (e.g. 400x400). Cytoscape offers a setting to fit each tree into its container, and will zoom in an out of each tree to the extent necessary to make the full tree visible within the given dimensions.</p>
  
  <p>Instead of telling each layout to fit the container, I would like to instead resize each container to accommodate its child canvas perfectly. In other words, I need a way of asking each instance of the Cytoscape canvas, "What width and height would you be at 0 zoom", or "how many pixels do you need in each direction to draw fully", and then resize each container appropriately.</p>
  
  <p>Cytoscape does offer methods to get the canvas's <a href="http://js.cytoscape.org/#cy.width" rel="nofollow noreferrer"><code>width()</code></a> and <a href="http://js.cytoscape.org/#cy.height" rel="nofollow noreferrer"><code>height()</code></a>, but those end up being the actual dimensions (which may not fit the container), instead of the "desired"/needed dimensions.</p>
  
  <p>It occurred to me that I could come up with some heuristic to set the container's width and height based on the number of nodes and edges, but this approach hasn't proven fruitful yet; the number of nodes and edges tells me little about the final layout and arrangement, which alone informs decisions about desired width and height.</p>