I now tried to adapt this project into responsive design, and show the charts according to the screen size.
my problem: On narrow screen, when the range in the 'overview' is too small (measured in pixels?), I do not get the overview plotselected event.
How can I force 'overview' selection?
In the image below, one can see selection of last-3-days. this works. but selection of last-1-day does not work:
The Flot selection plugin has a minSize
option which is by default set to 5 pixels. Since one day of data in your overview is about 3 pixels wide the plotselected
event does not fire. Set the minSize
to 1 and it should work with a chart of size down to 100 pixels.
From the comments in the jquery.flot.selection.js file:
"minSize" is the minimum size a selection can be in pixels. This value can be customized to determine the smallest size a selection can be and still have the selection rectangle be displayed. When customizing this value, the fact that it refers to pixels, not axis units must be taken into account. Thus, for example, if there is a bar graph in time mode with BarWidth set to 1 minute, setting "minSize" to 1 will not make the minimum selection size 1 minute, but rather 1 pixel. Note also that setting "minSize" to 0 will prevent "plotunselected" events from being fired when the user clicks the mouse without dragging.