Dashboard with Gauges

[Carlo Durso]

HI,

I'm working on a dashboard with couple of charts and a ChartRangeFilter control wrapper. I'm trying to add some gauges that interact with the filter, here's a prototype: http://conviertemas.com/report/excel/datalytics.html

The idea is that the gauge calculate the average value for the selected time frame on the fly by moving the needle and without redrawing the gauge itself. I'd appreciate suggestions on viable alternatives to help me solve it. 

[asgallant]

You can't update the gauges without redrawing them, but otherwise this is possible.  You need to set up a "ready" event handler for the dashboard, and pull the dataTable from one of the charts (using the chartWrapper's #getDataTable method).  Group this data and use it to populate a DataTable for the gauges, then draw the gauges.  Every time the range filter is changed, the dashboard updates, redraws, and fires the "ready" event, which triggers the update on the gauges.  See an example built on your code here: http://jsfiddle.net/asgallant/H4xcX/ 

[Carlo Durso]

Thanks, that sounds great and very detailed.

[Billy Bones]

ASG,

Is there a way to stop the Y axis of the column chart from scaling in your example? ie, with the slider on the far left, the graph goes from 30 to 70, but on the far right it goes from 0 to 40.  Is there a way to make this always display from 0 to 70?

Is there a slider that is not a range slider? ie if I wanted to have a graph over time and use a slider to pinpoint a moment in time and display my charts from that moment in time is there a better way to do that than using the chartrangeslider?

Billy 

[asgallant]

Y-axis scaling can be handled in two ways:

1) set the vAxis.minValue and/or vAxis.maxValue options.  These options serve as guidelines to the chart for scaling the axis, but the chart can overrule them if either:

    a) there are values being graphed that lie outside these bounds (ie, if you set minValue to 0 and there is a data point at -10, the axis will go below 0), or

    b) if the API needs to change them to make the value labels appear on "clean" values (typically, this means integer multiples of 5)
This can result in axis boundaries that lie outside what you want; if so, use option 2.

2) set the vAxis.viewWindow.min and/or vAxis.viewWindow.max options.  These put hard caps on the axis boundaries, so it will always use them as the min/max regardless of what the chart values are or whether the labels would fall on clean values or not (though often times the gridlines are drawn at values other than the min and max to keep the axis labels clean).

As to the second question, no, there are not any sliders other than range sliders packaged with the API.  That doesn't mean you can't build you own, though.  I'd suggest googleing for sliders compatible with whatever js library you are comfortable using (jQuery UI has some, I believe).  You can use event handlers on the slider to filter your dashboard's data.