To center the chart in the page, you'll have to use CSS, perhaps something
like this:
#visualization: {
margin-left: auto;
margin-right: auto;
}
To get the currency sign to appear, you will have to format the data in
your DataTable (and format the vAxis of the chart if you want that to have
the currency symbol as well), like this:
function drawVisualization() {
// Create and populate the data table.
var data = google.visualization.arrayToDataTable([
['Years', 'Average Sold Price'],
['2002', 342371],
['2003', 365556],
['2004', 402310],
['2005', 430962],
['2006', 460739],
['2007', 490932],
['2008', 507621],
['2009', 526248],
['2010', 588254],
['2011', 623887],
['2012', 681408]
]);
var formatter = new google.visualization.NumberFormat({pattern:
'$####'});
formatter.format(data, 1);
// Create and draw the visualization.
new
google.visualization.LineChart(document.getElementById('visualization')).
draw(data, {
curveType: "function",
align: center
width: 500,
height: 400,
vAxis: {
maxValue: 10,
format: '$####'
}
});
}
On Monday, February 4, 2013 4:43:30 PM UTC-5, Todd Lee wrote:
>
> I would like to know how to center the graph below and get the currency
> sign to show.
> Thanks in advance.
>
>
>
> !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "
> http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";>
> <html xmlns="http://www.w3.org/1999/xhtml";>
> <head>
> <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
> <title>
> Average Sale Price History
> </title>
> <script type="text/javascript" src="http://www.google.com/jsapi
> "></script>
> <script type="text/javascript">
> google.load('visualization', '1', {packages: ['corechart']});
> </script>
> <script type="text/javascript">
> function drawVisualization() {
> // Create and populate the data table.
> var data = google.visualization.arrayToDataTable([
> ['Years', 'Average Sold Price'],
> ['2002', 342371],
> ['2003', 365556],
> ['2004', 402310],
> ['2005', 430962],
> ['2006', 460739],
> ['2007', 490932],
> ['2008', 507621],
> ['2009', 526248],
> ['2010', 588254],
> ['2011', 623887],
> ['2012', 681408]
> ]);
>
> // Create and draw the visualization.
> new
> google.visualization.LineChart(document.getElementById('visualization')).
> draw(data, {curveType: "function",
> align: center
> width: 500, height: 400,
> vAxis: {maxValue: 10}}
> );
> }
>
>
> google.setOnLoadCallback(drawVisualization);
> </script>
> </head>
> <body style="font-family: Arial;border: 0 none;">
> <div id="visualization" style="width: 500px; height: 400px;"></div>
> </body>
> </html>
>
>
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at
http://groups.google.com/group/google-visualization-api?hl=en.
For more options, visit https://groups.google.com/groups/opt_out.
