statgen / locuszoom

A Javascript/d3 embeddable plugin for interactively visualizing statistical genetic data from customizable sources.
https://statgen.github.io/locuszoom/
MIT License
154 stars 29 forks source link

[request] Support rendering plots in collapsed widgets #159

Closed abought closed 4 years ago

abought commented 5 years ago

Via @benralexander

Purpose

The portal has many features, and data is sometimes slow to load. Because data is the limiting step, they would like to render some of their plots in collapsed divs (before the user tries to interact with that feature).

They would like to render this data inside a collapsed div before the user has need of it. In practice, certain plot types- esp forest plots- have problems doing this.

The preferred mechanism involves standard collapse widgets, particularly bootstrap collapse and accordion.

Details

The only other coding question I have involves trying to instantiate a plot ( standard LZ, or a forest plot, or something else ) when the window is not immediately displayed ( the HTML holding the section is hidden, which sometimes we want to do in the UI). In this case the automatic sizing of the LZ code doesn't work out well for me... Is there a way to tell LZ "here is the width and height of the DIV I want you to use. Don't try to query the DOM, but instead simply use the values I've given you"?

1) I've used two techniques, and they've both provided the same results. One is the Bootstrap "collapse" (https://getbootstrap.com/docs/4.1/components/collapse/), and the other is the Bootstrap "accordion" (ex. https://www.w3schools.com/howto/howto_js_accordion.asp) ... all the code in our working branches works around the problem. If you want to see an example of a workaround you can go to our production version and look at the "associations at a glance" section. What you will see at first is that the forest plot appears directly underneath the pheWAS plot, though after you change tabs once then the forest plot and pheWAS plot show up in the right places. The problem I'm avoiding is that if I create the forest plot without giving it the class "active" ( and thus allocating screen space for it) then the forest plot doesn't show up at all.

... In other cases it is more of a problem, especially with traditional LZ plots that happen to require lots of data. Those are slow calls (probably both data transmission and DB lookup), and so I would much rather have those plots generate in the background before the user requests them.

abought commented 4 years ago

Closing for now, as the portal implementation has changed substantially. Other mechanisms, such as deferring (instead of hiding) rendering will be preferred.