Hide a row (aka series) in Google chart

问题

Is there please a possibility to blend out (hide) a line in Google Line Chart?

We have many line charts with multiple series of close data values and my boss asks me to add a way to hide a series (preferably by clicking the line or the legend with a mouse).

I have added a select event listener to my very simple test case below (just open it in a browser and it will work), but I'm not sure what to do next:

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1','packages':['corechart']}]}"></script>
<script type="text/javascript">

        var data = {"L_B8_ACLR_50_0_QPSK_1_H":{"rows":[
        {"c":[{"v":"UTRA_1_DOWN"},{"v":-42.9},{"v":-42.4},{"v":-80},{"v":-35}]},
        {"c":[{"v":"E-UTRA_1_DOWN"},{"v":-49.4},{"v":-39.9},{"v":-80},{"v":-32}]},
        {"c":[{"v":"E-UTRA_1_UP"},{"v":-48.9},{"v":-48.6},{"v":-80},{"v":-32}]},
        {"c":[{"v":"UTRA_1_UP"},{"v":-49.5},{"v":-49.4},{"v":-80},{"v":-35}]},
        {"c":[{"v":"UTRA_2_UP"},{"v":-58.9},{"v":-58.9},{"v":-80},{"v":-38}]}],

        "cols":[{"p":{"role":"domain"},"label":"MEASUREMENT","type":"string"},
        {"p":{"role":"data"},"label":"Row A","type":"number"},
        {"p":{"role":"data"},"label":"Row B","type":"number"},
        {"p":{"role":"interval"},"label":"LSL","type":"number"},
        {"p":{"role":"interval"},"label":"USL","type":"number"}]}};

        function drawCharts() {
                for (var csv in data) {
                        var x = new google.visualization.DataTable(data[csv]);

                        var options = {
                                title: csv,
                                width: 800,
                                height: 600
                        };

                        var chart = new google.visualization.LineChart(document.getElementById(csv));
                        google.visualization.events.addListener(chart, 'select', selectHandler);
                        chart.draw(x, options);
                }
        }

        function selectHandler(e) {
            alert('How to hide a row in the chart?');
        }


        $(function() {
                google.setOnLoadCallback(drawCharts);
        });

</script>
</head>
<body>
<div id="L_B8_ACLR_50_0_QPSK_1_H"></div>
</body>
</html>

来源：https://stackoverflow.com/questions/16921097/hide-a-row-aka-series-in-google-chart

标签

charts

interactive

google-visualization

linechart