Google Combo Chart
Example of Combo Chart...
by gdicerbo
HTML
<script src="http://www.google.com/jsapi?fake=.js"></script>
<script>
// Load the Visualization API and the piechart package.
google.load('visualization', '1.0', {
'packages': ['corechart']
});
// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawVisualization);
// Some raw data (not necessarily accurate)
function drawVisualization() {
var query = new google.visualization.Query(
'https://docs.google.com/spreadsheets/d/1sVdC24p4B7jxx19lhP0B-k-LvRClBYs1ygIFF3qGd_I/gviz/tq?gid=2023578829');
query.send(handleQueryResponse);
}
// Create and populate the data table.
function handleQueryResponse(response) {
var data = response.getDataTable();
// Create and draw the visualization.
var ac = new google.visualization.ComboChart(document.getElementById('visualization'));
ac.draw(data, {
width: 1150,
height: 750,
'chartArea': {
'width': '85%',
'height': '85%'
},
colors: ['#8dc641', '#6a747b', '#6bbed1'],
vAxis: {title: "Expenses/Repayment ($)", format:'short'},
hAxis: {type: 'category', direction:1,
slantedText:true,
slantedTextAngle:90},
seriesType: "bars",
isStacked: true,
series: {2: {type: "line"}},
});
}
//next
function drawVisualizationone() {
var query = new google.visualization.Query('https://docs.google.com/spreadsheets/d/1sVdC24p4B7jxx19lhP0B-k-LvRClBYs1ygIFF3qGd_I/edit#gid=0');
query.send(handleQueryResponse);
}
// Create and populate the data table.
function handleQueryResponse(response) {
var data = response.getDataTable();
// Create and draw the visualization.
var ac = new google.visualization.ComboChart(document.getElementById('visualization'));
ac.draw(data, {
width: 1150,
height: 750,
legend: 'bottom',
colors: ['#8dc641', '#6a747b', '#6bbed1'],
vAxis: {title: "Expenses/Repayment ($)", format:'short', titleTextStyle: {
italic: false
...