Hi,
I'm new to js, so please go easy. I'm trying to format my vAxis for
currency, but I cannot figure out why my current code does not work.
The extra code is for a custom popup that appears when the user mouses
over a certain column. Any help is greatly appreciated.
Thanks
Code -->
google.load('visualization', '1', {'packages': ['linechart']});
//set callback
google.setOnLoadCallback (createChart);
//callback function
function createChart() {
//create data table object
var dataTable = new
google.visualization.DataTable();
//define columns
dataTable.addColumn('string','Year');
dataTable.addColumn('number', 'Top 1%');
dataTable.addColumn('number', 'Highest 20%');
dataTable.addColumn('number', 'Fourth 20%');
dataTable.addColumn('number', 'Middle 20%');
dataTable.addColumn('number', 'Next 20%');
dataTable.addColumn('number', 'Bottom 20%');
//define rows of data
dataTable.addRows([['1979',
550000,140300,73200,54100,36100,16600],
['1980',518500,135700,71000,52300,34700,16000],
['1981',514900,134700,71400,51700,34300,15600]]);
//instantiate chart objects
var chart = new
google.visualization.LineChart(document.getElementById('chart'));
var formatter = new
google.visualization.NumberFormat({prefix:
'$'});
formatter.format(dataTable, 1); // Apply
formatter
formatter.format(dataTable, 2); // Apply
formatter
formatter.format(dataTable, 3); // Apply
formatter
//define options for visualization
//draw chart
chart.draw(dataTable, {width: 900, height: 400, title:
'Average Pre-tax U.S. Household Income, 1979 - 2007', vAxis: {format:
'$#,###', maxValue: 10}}
);
//register callbacks
google.visualization.events.addListener(chart,
'onmouseover', showDetails);
google.visualization.events.addListener(chart,
'onmouseout', hideDetails);
}
function showDetails(e) {
switch (e['column']) {
case 1:
document.getElementById('details5').style.visibility='visible';
break;
case 2:
document.getElementById('details4').style.visibility='visible';
break;
case 3:
document.getElementById('details3').style.visibility='visible';
break;
case 4:
document.getElementById('details2').style.visibility='visible';
break;
case 5:
document.getElementById('details1').style.visibility='visible';
break;
case 6:
document.getElementById('details0').style.visibility='visible';
break;
}
}
function hideDetails(e) {
switch (e['column']) {
case 1:
document.getElementById('details5').style.visibility='hidden';
break;
case 2:
document.getElementById('details4').style.visibility='hidden';
break;
case 3:
document.getElementById('details3').style.visibility='hidden';
break;
case 4:
document.getElementById('details2').style.visibility='hidden';
break;
case 5:
document.getElementById('details1').style.visibility='hidden';
break;
case 6:
document.getElementById('details0').style.visibility='hidden';
break;
}
}
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-visualization-api?hl=en.
