Add option to render multiple connected components at once

[fedarko]

From @fedarko on September 27, 2016 15:39

I guess this would be done in the viewer. We could do this by taking the bounding boxes for each component and "concatenating" them, with some margins in between. (For some reason, laying out components individually seems to be faster than laying out the entire graph at once—so we'd still generate layouts on a component-by-component basis, but just concatenate the resulting layouts to produce something basically equivalent.)

This probably shouldn't be the default behavior (will wreck viewer performance for huge graphs that have sizable non-largest components) but having it as an option would be useful in some cases (e.g. graphs composed of a lot of tiny component fragments).

Copied from original issue: fedarko/MetagenomeScope#93

[fedarko]

It should be possible for the user to specify a range of components, instead of just a boolean "all or one" thing. Enclosed are some sample "inputs" and what should be displayed:

• 2
  • renders just component 2 (this is the only sort of input the viewer interface accepts at present).
• 1–3
  • renders all components from rank 1 to rank 3, inclusive.
• 1, 4, 5
  • renders components 1, 4, and 5.
• all
  • renders all components in the graph.
• all WHERE number_nodes >= 3
  • renders all components in the graph where the number of nodes is greater than or equal to 3.
  • implementing this will necessitate running some sort of query through sql.js to identify the exact component IDs involved; allowing the user to provide the literal SQL queries themselves might make implementing this a bit easier, although that'd 1) necessitate user expertise with SQL and the .db structure and 2) be really insecure, so I don't think it's the best idea here.
• 1, 2, 5–8
  • renders components 1, 2, and all components in the inclusive range of 5 to 8.

The latter two input types are really fancy (but, of course, potentially really useful -- esp. the second-to-last input type) and I'm not even sure how to efficiently implement them off the top of my head, so I think working towards input cases 2, 3, and 4 above is probably a sufficient goal for the time being.

[fedarko]

Planned options:

1. Draw single component (current behavior -- shows a single component selector)
2. Draw component containing a node (shows a text box the user can enter a node name in; will draw this component, if present)
3. Draw range of components (shows two component selectors, one labeled from and another labeled to, and draws all components in that range).
4. Draw all components (doesn't have any extra UI elements -- just a button that draws all components)

Number 3 might be difficult (mostly from a UI perspective tbh), but 2 and 4 shouldn't be too bad to do with the new data handling stuff (and I think they'll be the most useful).