javascript - How to change format between currency and percent in Google Charts? -

javascript - How to change format between currency and percent in Google Charts? -

i have made chart in google charts. have range filter can filter out different years , on, , have select filter can take info want compare. question: how can have select filter chooses between currency , percent? can see, have columnfilter (select) on top. want "formatfilter" changes vaxis percent , currency. working illustration here

here's code:

google.setonloadcallback(drawchart); function drawchart() { var info = google.visualization.arraytodatatable([ ['date', 'a', 'b', 'c', 'd', 'e'], ['2012 januari', 100, 126, 122, 232, 215], ['2012 februari', 152, 254, 242, 168, 136], ['2012 mars', 300, 232, 234, 195, 343], ['2012 april', 450, 242, 325, 121, 126], ['2012 maj', 600, 224, 234, 151, 124], ['2012 juni', 750, 121, 867, 152, 235], ['2012 juli', 900, 942, 566, 267, 457], ['2012 augusti', 950, 762, 363, 794, 279], ['2012 september', 105, 378, 345, 175, 345], ['2012 oktober', 200, 284, 600, 228, 315], ['2012 november', 210, 453, 534, 378, 153], ['2012 december', 205, 166, 536, 274, 315], ['2013 januari', 463, 134, 345, 267, 378], ['2013 februari', 150, 234, 534, 271, 745] ]); var columnstable = new google.visualization.datatable(); columnstable.addcolumn('number', 'colindex'); columnstable.addcolumn('string', 'collabel'); var initstate = { selectedvalues: [] }; // set columns info table (skip column 0) (var = 1; < data.getnumberofcolumns() ; i++) { columnstable.addrow([i, data.getcolumnlabel(i)]); // can comment out next line if want have default selection other whole list initstate.selectedvalues.push(data.getcolumnlabel(i)); } // can set individual columns default columns (instead of populating via loop above) this: //initstate.selectedvalues.push(data.getcolumnlabel(2)); var dashboard = new google.visualization.dashboard( document.getelementbyid('linedashboard_div')); var chart = new google.visualization.chartwrapper({ charttype: 'linechart', containerid: 'linechart_div', datatable: data, options: linechartoptions }); var columnfilter = new google.visualization.controlwrapper({ controltype: 'categoryfilter', containerid: 'linecolumnfilter_div', datatable: columnstable, options: { filtercolumnlabel: 'collabel', ui: { caption: "compare", label: false, allowtyping: false, allowmultiple: true, allownone: false, selectedvalueslayout: 'below' } }, state: initstate }); var rangefilter = new google.visualization.controlwrapper({ controltype: 'numberrangefilter', containerid: 'linerangefilter_div', options: { filtercolumnindex: '1', ui: { showrangevalues: false, label: false } } }); function setchartview() { var state = columnfilter.getstate(); var row; var view = { columns: [0] }; (var = 0; < state.selectedvalues.length; i++) { row = columnstable.getfilteredrows([{ column: 1, value: state.selectedvalues[i] }])[0]; view.columns.push(columnstable.getvalue(row, 0)); } // sort indices original order view.columns.sort(function (a, b) { homecoming (a - b); }); chart.setview(view); chart.draw(); } google.visualization.events.addlistener(columnfilter, 'statechange', setchartview); dashboard.bind(rangefilter, chart); dashboard.draw(data); setchartview(); columnfilter.draw(); }

javascript format google-visualization