January 19, 2012

Tutorial: Update Google Charts Candlestick with a button

To update you Google Chart Candlestick with a button, you need to add this code block at the end of the drawVisialization function if you follow this code layout: code.google.com/apis/chart/interactive/docs/gallery/candlestickchart.html

HTML
//This is the button
<input type="button" value="Next day" id="next_day" />

Javascript
//This is the end of the original javascript function, put the new code block after this line
chart.draw(data, options);


//This is the code block you need
document.getElementById('next_day').onclick = function () {

//This is the new array, it replaces the original array
var dataArray = [["", 31, 38, 55, 66]];

var data = google.visualization.arrayToDataTable(dataArray, true);

//Redraw the chart
chart.draw(data, options);
};

No comments:

Post a Comment