Users both at Michigan and at the Broad have requested the means to download/export a plot.
Solution
As originally conceived in #27 this branch creates a general "controls" element that is little more than an HTML div that sits below the plot. It provides a Download SVG button and displays the current dimensions of the plot. It may be useful to stage other plot-wide HTML-based UI elements there in the future.
Controls element layout spec
The controls element can be configured in the layout at the top level, like so:
This is the configuration present in the default layout on this branch. The attribute show: "onmouseover" effectively attaches a mouse event listener to the div that is originally populated by the LocusZoom plot such that when the mouse is over any element inside that container (the plot itself, the controls element, and/or any tooltips the plot has generated) then the controls element will be visible.
The hide_delay attribute is a count of milliseconds. When show is "onmouseover" the mouseout event is tied to a timeout so that the control element doesn't flicker in and out of existence when the mouse is near the edge of the container.
The show attribute can be set to always to render the control element once and just update it as the plot changes, never hiding it. It can also be set to false to prevent from ever showing.
onUpdate() updated
In #47 a pattern was introduced where someone implementing a LocusZoom plot could define an onUpdate function that would fire whenever the plot is updated (i.e. change of anything related to state or layout). The plot builder, which debuted in that branch, necessitated this ability to update its display of the underlying layout whenever it changed.
This branch extends the onUpdate pattern to allow for arbitrarily many onUpdate functions to be registered with a single LocusZoom plot. An update event will loop through and execute all defined functions, similar to how jQuery allows arbitrarily many functions for $(document).ready().
The Problem
Users both at Michigan and at the Broad have requested the means to download/export a plot.
Solution
As originally conceived in #27 this branch creates a general "controls" element that is little more than an HTML div that sits below the plot. It provides a
Download SVGbutton and displays the current dimensions of the plot. It may be useful to stage other plot-wide HTML-based UI elements there in the future.Controls element layout spec
The controls element can be configured in the layout at the top level, like so:
This is the configuration present in the default layout on this branch. The attribute
show: "onmouseover"effectively attaches a mouse event listener to the div that is originally populated by the LocusZoom plot such that when the mouse is over any element inside that container (the plot itself, the controls element, and/or any tooltips the plot has generated) then the controls element will be visible.The
hide_delayattribute is a count of milliseconds. Whenshowis"onmouseover"the mouseout event is tied to a timeout so that the control element doesn't flicker in and out of existence when the mouse is near the edge of the container.The
showattribute can be set toalwaysto render the control element once and just update it as the plot changes, never hiding it. It can also be set tofalseto prevent from ever showing.onUpdate() updated
In #47 a pattern was introduced where someone implementing a LocusZoom plot could define an
onUpdatefunction that would fire whenever the plot is updated (i.e. change of anything related to state or layout). The plot builder, which debuted in that branch, necessitated this ability to update its display of the underlying layout whenever it changed.This branch extends the
onUpdatepattern to allow for arbitrarily many onUpdate functions to be registered with a single LocusZoom plot. An update event will loop through and execute all defined functions, similar to how jQuery allows arbitrarily many functions for$(document).ready().