JavaScript
function drawChart() {
var sample_data = document.getElementById('sample_data').value;
var data2 = eval("["+sample_data+"]");
var data = new google.visualization.arrayToDataTable(data2);
var options = {
hAxis: {title: 'Age', minValue: 0,maxValue:105},
vAxis: {title:'Savings', minValue: 0,maxValue:2500000},
width: 960, height: 300,
colors: ['#4a82bd'],
legend:'none'
};
var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function buffer(){
setTimeout(function () {drawChart();}, 100);
}
function ViewModel() {
var self =this;
self.rangeSelect = ko.observable('0%');
self.dataGetter = ko.computed(function(){
var range = self.rangeSelect();
if(range=='0%'){
return "['Age','Savings'],"+
"[25,0],"+
"[26,2738],"+
"[27,5834],"+
"[28,9278],"+
"[29,13191],"+
"[30,17592],"+
"[31,22288],"+
"[32,27418],"+
"[33,32993],"+
"[34,38954],"+
"[35,45304],"+
"[36,52127],"+
"[37,59254],"+
"[38,66663],"+
"[39,74535],"+
"[40,83148],"+
"[41,91537],"+
"[42,100823],"+
"[43,110002],"+
"[44,119837],"+
"[45,129897],"+
"[46,141052],"+
"[47,152166],"+
"[48,163757],"+
"[49,175561],"+
"[50,188520],"+
...