I have the following code to draw candlestick visualization. But the visualization is not generated. I am unable to trace error using Error Console!.
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load('visualization', '1', {packages: ['corechart']});
function drawVisualization() {
// Populate the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Date');
data.addColumn('number');
data.addColumn('number');
data.addColumn('number');
data.addColumn('number');
data.setValue(0, 0,'Mon');
data.setValue(0, 1, '2');
data.setValue(0,2,'6');
data.setValue(0,3,'8');
data.setValue(0,4,'10');
data.setValue(1, 0,'Mon');
data.setValue(1, 1, '2');
data.setValue(1,2,'6');
data.setValue(1,3,'8');
data.setValue(1,4,'10');
// Draw the chart.
var chart = new google.visualization.CandlestickChart(document.getElementById('visualization'));
chart.draw(data, {legend:'none', width:600, height:400});
}
google.setOnLoadCallback(drawVisualization);
</script>
Any Help Greatly Appreciated!
Thank You!
Two problems:
1 – You need to add rows to the table before you try and set their values.
2 – Values for index 1,2,3 and 4 have to be numbers instead of strings since Columns 1,2,3,4 are of a numeric type
Here is a working example
http://jsfiddle.net/WcKFf/2/