Adding and Removing Column Views in Google Charts

In google charts I am creating a line chart with multiple columns and different values ​​inside. I am wondering how I can filter my charts to only show certain columns while being inside the google chart itself and not from code.

Here's an example table:

name | job       | salary | bonus
Joe  | Mech. Eng.| 150000 | 20000
Jim  | Soft. Eng.| 175000 | 10000
Tom  | Chem. Eng.| 250000 | 25000

      

JavaScript to hide columns (in the code itself, not a select filter, which I'm wondering how to do) is simple view: {'columns': [0,2,3]}

. Is there a filter I can use so that the user on the web page can change the view by selecting or deselecting columns?

var chart = new google.visualization.ChartWrapper({
                                'chartType': 'LineChart',
                                'containerId': 'salary',
                                'options': { 'left': '25%',
                                    'title':'Job Salary and Bonus',
                                    'hAxis':{ 'title': '$$$'},
                                    'vAxis':{ 'title': 'Name'},
                                    'interpolateNulls': true,
                                    'height': '80%',
                                    'width': '80%' ,
                                    'width':800,
                                    'height':600,
                                'view': { 'columns': [0,2,3]}
                                }
                    });

      

Shows:

enter code here

On a larger scale, I would like to be able to select Name or Job to compare salary / bonus with other jobs. I was wondering if there is a way to do this in Google Charts.

+3


source to share





All Articles