Skip to content

cmonitor_chart should make it possible to show/hide a specific measurement #18

@f18m

Description

@f18m

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:

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions