cmonitor
cmonitor copied to clipboard
cmonitor_chart should make it possible to show/hide a specific measurement
It should be possible inside each google chart, e.g. AreaCharts, created by cmonitor_chart to show/hide a specific measurment, possibly by simply clicking on the legend entry. E.g. to add this feature on graph#5, cmonitor_chart should append as code:
// ...
// existing code
g_chart = new google.visualization.AreaChart(document.getElementById("chart_master_div"));
g_chart.draw(data_graph5, options_graph5);
g_current_data = data_graph5;
g_current_options = options_graph5;
reset_combo_boxes("");
// new javascript code
var columns = [];
var series = {};
for (var i = 0; i < data_graph5.getNumberOfColumns(); i++) {
columns.push(i);
if (i > 0) {
series[i - 1] = {};
}
}
google.visualization.events.addListener(g_chart, 'select', function () {
var sel = g_chart.getSelection();
// if selection length is 0, we deselected an element
if (sel.length > 0) {
// if row is undefined, we clicked on the legend
if (sel[0].row === null) {
var col = sel[0].column;
if (columns[col] == col) {
// hide the data series
columns[col] = {
label: data_graph5.getColumnLabel(col),
type: data_graph5.getColumnType(col),
calc: function () {
return null;
}
};
// grey out the legend entry
series[col - 1].color = '#CCCCCC';
}
else {
// show the data series
columns[col] = col;
series[col - 1].color = null;
}
var view = new google.visualization.DataView(data_graph5);
view.setColumns(columns);
g_chart.draw(view, options_graph5);
}
}
});
Taken from:
- http://jsfiddle.net/xDUPF/53/
- https://stackoverflow.com/questions/17444586/show-hide-lines-data-in-google-chart