Plotly.js: Update menus open items

[etpinard]

Layout menu feature PR: https://github.com/plotly/plotly.js/pull/770

Open items:

• Should we do some validation for 'args' depending on method or just let Plotly[method] error out?
• Should add more global settings:
  
  
  
  • width
  
  
  • height (instead of being inferred by the label dimensions)
  
  
  • title (above header)
  
  
  • header borderwidth
  
  
  • active / hover bgcolor
  
  
  • gap between buttons
  
  
  • gap between header & buttons
  
  
• We should probably make dropdown items scrollable
• Should the dropdown arrow direction depend on direction see https://github.com/plotly/plotly.js/pull/974#discussion_r80271589

[jackparmer]

We should probably make dropdown items scrollable

Yep. Here's someone struggling with this out-in-the-wild. Also came up from a customer @charleyferrari chatted up today.

https://plot.ly/~Scochran/159/price-vs-date/

[rreusser]

Closing #890 in favor of this. I'll only add that if menus scrolled, that would presumably also solve the hard limit of six items (a very hard limit—the menu disappears if you exceed six).

Edit: one more thing: I found the menu takes up too much vertical space where it should instead probably just overlap the plot when expanded. There may be a config option to work around this, but unless there's a reason I'm not seeing, it should perhaps be the default. See #890 for screenshot and example.

[rreusser]

@etpinard — What do you think about changing the expanded menu to HTML? It will be a bit awkward to position relative to the top-level SVG container, but it would probably be significantly more accessible and require 80% less code. Plus, it's not clear to me why you'd want the _expanded_ menu to be rendered to SVG. Just a thought as I look through what it means to implement complex controls in SVG.

[Kully]

Another user who is having trouble accessing menu items past the 10th one or so: https://plot.ly/~wholleran/829/completion-percentage-vs-period/?share_key=J0gquGi2vrEhTurmsYsP3s

[jackparmer]

Hey @n-riesco - Can you take this before you go onto animations for bars? (At least making it scroll-able). Thanks!

[etpinard]

Closing as the main item on the list :arrow_double_up: was completed in https://github.com/plotly/plotly.js/pull/1214 and https://github.com/plotly/plotly.js/issues/1345 repeats the title option request. The other items on the list are of much lesser priority.