jQuery Google Charting Reference

backgroundColor: 'aqua'
backgroundColor: 'fe5621'
backgroundColor: $.gchart.gradient('horizontal',
	'black', 'transparent')
backgroundColor: $.gchart.stripe('horizontal',
	['white', 'silver', 'gray', 'white', 'silver'])

legendOrder: 'automatic'
legendOrder: '1,3,5,0,2,4'

series: [$.gchart.series('2004', [91.80, 2.83, 4.06]),
	$.gchart.series('2005', [88.16, 1.61, 8.13])]
series: $.gchart.seriesForXYLines(
	[$.gchart.series([[0, 20], [30, 30], [60, 40], [70, 50],
	[90, 60], [95, 70], [100, 80]], 'red'),
	$.gchart.series([[10, 100], [30, 90], [40, 40], [45,20],
	[52, 10]], 'green'),
	$.gchart.series([5, 33, 50, 55, 7], 'blue')])

functions: [$.gchart.fn(0, 'x', 0, 10, 0.1, 'sin(x) * 50 + 50')]
functions: [$.gchart.fn(0, $.gchart.fnVar('x', 0, 10, 0.1),
	'sin(x) * 50 + 50'),
	$.gchart.fn(1, $.gchart.fnVar('y', 0, 10, 0.1),
	'cos(y) * 50 + 50')]
functions: [$.gchart.fn(1, 'x', 0, '(x / 5) ^ 2')]

axes: ['left']
axes: [$.gchart.axis('left', ['0', '50', '100']),
	$.gchart.axis('bottom', ['2005', '2006', '2007', '2008'])]
axes: [$.gchart.axis('y', 100, 200),
	$.gchart.axis('x', 1000, 0, -200)]
axes: [$.gchart.axis('right').
		ticks('red', -100).drawing('ticks'),
	$.gchart.axis('bottom').
		format($.gchart.formatFloat, '', 'K', 1, false, true)]

ranges: [$.gchart.range('ccccff', 0.25, 0.75),
	$.gchart.range(true, 'ccffcc', 0.6, 0.8)]

markers: [$.gchart.marker('diamond', 'red', 0)]
markers: [$.gchart.marker('flag', 'red',
		0, 7, 0, 0, 'Unusual'),
	$.gchart.marker('number', 'blue', 0, 4)]

icons: [$.gchart.bubbleIcon('Big sale')]
icons: [$.gchart.noteIcon('2010 Q1', 'Merger',
		'thought', '', 1, 3),
	$.gchart.weatherIcon('Big storm', '',
		'taped', 'thunder', 2, 5)]

mapArea: 20 // pixels border
mapArea: [50, 50, 20, 20] // pixels border
mapArea: [-60, -90, 20, -30], mapLatLong: true // lat/long
mapArea: 'africa' // old style

mapRegions: ['AU', 'AU-QLD', 'JP']
series: [$.gchart.series(40, 60, 100)]

$(selector).gchart({onLoad: saveRegions, provideJSON: true}).
	mouseover(function(event) {
		var region = $.gchart.findRegion(event, regionData);
		$('#region').text(!region ? '' :
			region.type + ' ' + region.series + ' ' + region.point);
	});

var regionData = null;

function saveRegions(jsonData) {
	regionData = jsonData
}

$(selector).gchart('option', {title: 'My Chart'})
$(selector).gchart('option',
	{title: 'My Chart', encoding: 'simple'})

$(selector).gchart('option', 'title', 'My Chart');

var settings = $(selector).gchart('option');
var format = $(selector).gchart('option', 'format');

$.gchart.series([10, 20, 30])
$.gchart.series('Firefox',
	[0.00, 4.06, 8.13, 9.95], 'blue')
$.gchart.series('Max', [29.1, 28.9, 28.1, 26.3, 23.5,
	21.2, 20.6, 21.7, 23.8, 25.6, 27.3, 28.6],
	'red', 'ffcccc', 0, 40, 2, [4, 2])

$(selector).gchart({type: 'lineXY',
	series: $.gchart.seriesForXYLines(
	[$.gchart.series([[0, 20], [30, 30],
	[60, 40], [70, 50], [90, 60], [95, 70],
	[100, 80]], 'red'),
	$.gchart.series([[10, 100], [30, 90],
	[40, 40], [45,20], [52, 10]], 'green'),
	$.gchart.series([5, 33, 50, 55, 7], 'blue')])})

$.gchart.seriesFromCsv(
	'label,color,y1,y2,y3,y4\n' +
	'IE,ff0000,95.97, 91.80, 88.16, 86.64\n' +
	'Netscape,00ff00,3.39, 2.83, 1.61, 0.00\n' +
	'Firefox,0000ff,0.00, 4.06, 8.13, 9.95')

<data>
	<series label="" color="" fillColor=""
		minValue="" maxValue=""
		lineThickness="" lineSegments="">
		<point x="" y=""/>
		...
	</series>
	...
</data>

$.gchart.seriesFromXml(
  '<?xml version="1.0" encoding="UTF-8"?>\n' +
  '<data>\n' +
  '  <series label="IE" color="ff0000">\n' +
  '    <point y="95.97"/>\n' +
  '    <point y="91.80"/>\n' +
  '    <point y="88.16"/>\n' +
  '    <point y="86.64"/>\n' +
  '  </series>\n' +
  '  <series label="Netscape" color="00ff00">\n'+
  '    <point y="3.39"/>\n' +
  '    <point y="2.83"/>\n' +
  '    <point y="1.61"/>\n' +
  '    <point y="0.00"/>\n' +
  '  </series>\n' +
  '  <series label="Firefox" color="0000ff">\n'+
  '    <point y="0.00"/>\n' +
  '    <point y="4.06"/>\n' +
  '    <point y="8.13"/>\n' +
  '    <point y="9.95"/>\n' +
  '  </series>\n' +
  '</data>')

$(selector).gchart($.gchart.scatter(
	[[10, 80], [30, 40, 50], [60, 70, 25],
	[90, 20], [20, 10], [40, 90], [20, 50, 75],
	[50, 70, 75], [90, 30], [70, 50]]))
$(selector).gchart($.gchart.scatter(
	[[10, 80], [30, 40, 50], [60, 70, 25],
	[90, 20], [20, 10], [40, 90], [20, 50, 75],
	[50, 70, 75], [90, 30], [70, 50]],
	[-50, 150, -50, 150],
	['Group 1', 'Group 2'], ['red', 'blue'])).
	gchart('change', {markers: [...]})

$(selector).gchart($.gchart.venn(
	100, 80, 60, 10, 30, 30, 10))

$(selector).gchart($.gchart.map(
	{AU: 20, AU_QLD: 60, BR: 40, US: 100, 'US-TX': 80}));
$(selector).gchart($.gchart.map(true, [-55, -85, 15, -35],
	{CO: 60, BR: 40}));
$(selector).gchart($.gchart.map(20, {FR: 100, FR_B: 80, PL: 40},
	'white', ['green', 'yellow', 'red']));
// Old style
$(selector).gchart($.gchart.map('world',
	{AU: 20, BR: 40, CO: 60, EG: 80, FR: 100, IN: 0,
	JP: 20, PL: 40, SA: 60, TR: 80, US: 100, ZA: 0}))
$(selector).gchart($.gchart.map('usa',
	{CA: 20, NV: 40, OR: 60, WA: 80},
	'white', ['green', 'yellow', 'red']))

$(selector).gchart($.gchart.meter('Speed', 70))
$(selector).gchart($.gchart.meter(['1', '2', '3'],
	[10, 30, 70]))
$(selector).gchart($.gchart.meter('Speed', 70,
	[], ['slow', 'faster', 'crazy']))
$(selector).gchart($.gchart.meter('', [[10, 30], 70],
	[], [], [1, [3, 5, 5, 7]]))

$(selector).gchart($.gchart.qrCode(
	'This is a QR Code'))
$(selector).gchart($.gchart.qrCode(
	'This one contains a longer text message',
	'ISO-8859-1', 'high', 2))

$(selector).gchart($.gchart.graphviz(true,
	{C_0: {}, H_0: {type: 's'}, H_1: {type: 's'}, H_2: {type: 's'},
	C_1: {type: 's'}, H_3: {type: 's'}, H_4: {type: 's'}, H_5: {type: 's'}},
	{C_0: ['H_0', 'H_1', 'H_2', 'C_1'], C_1: ['H_3', 'H_4', 'H_5']},
	{node: {shape: 'box', color: 'green'}}))

$.gchart.fn(0, 'x', 0, 10, 0.1, 'sin(x) * 50 + 50')
$.gchart.fn(0, $.gchart.fnVar('x', 0, 10, 0.1), 'sin(x) * 50 + 50')
$.gchart.fn(1, 'x', 0, '(x / 5) ^ 2')

$.gchart.fnVar('x', 0)
$.gchart.fnVar('x', 0, 10, 0.1)

$.gchart.axis('bottom', ['Jan', 'Feb', 'Mar',
	'Apr', 'May', 'Jun'], 'black');
$.gchart.axis('left', 0, 40, 'red', 'right'),
$.gchart.axis('left', ['C'], [50], 'red', 'right')

$.gchart.color(255, 165, 0) // orange
$.gchart.color('red')
$.gchart.color('blue', 128) // translucent blue

$.gchart.gradient('horizontal',
	'black', 'transparent')
$.gchart.gradient(60, 'lime', 'blue')
$.gchart.gradient(0, ['yellow', 'lime', 'blue'])
$.gchart.gradient(0, ['yellow', 'lime', 'blue'], [0.0, 0.25, 0.5])

$.gchart.stripe('horizontal', ['white', 
	'silver', 'gray', 'white', 'silver'])
$.gchart.stripe(60, ['white', 'ffa500'])
$.gchart.stripe(0, ['white', 'ffa500'], [0.1, 0.2])

$.gchart.marker('diamond', 'red', 0)
$.gchart.marker('circle', 'yellow', 1, 'every3')
$.gchart.marker('text', 'black', 0, 14, 12,
	'above', 'Note this')
$.gchart.marker('number', 'blue', 2, [2, 10], 15,
	'above', $.gchart.numberFormat('f', 1))

$.gchart.range('ccccff', 0.25, 0.75)
$.gchart.range(true, 'ccffcc', 0.6)

$.gchart.marker('number', 'blue', 0,
	$.gchart.numberFormat($.gchart.formatFloat, 1))
$.gchart.marker('number', 'green', 1,
	$.gchart.numberFormat('cAUD', '', 'M', 2))

$(selector).gchart({onLoad: saveRegions, provideJSON: true}).
	mouseover(function(event) {
		var region = $.gchart.findRegion(event, regionData);
		$('#region').text(!region ? '' :
			region.type + ' ' + region.series + ' ' + region.point);
	});

var regionData = null;

function saveRegions(jsonData) {
	regionData = jsonData
}

$.gchart.icon('map_spin', '1.0,30,ffcccc,10,b,Here!', 2, 3, 1.0)

$.gchart.bubbleIcon('Here it is')
$.gchart.bubbleIcon('Over here', 'home', 'bottomRight',
	false, 'no', 'lime', 'green', 2, 3, 1.0)

$.gchart.mapPinIcon('X')
$.gchart.mapPinIcon('', 'home', 'star', 'no',
	'lime', 'green', 2, 3, 1.0)

$.gchart.noteIcon('', 'Here it is')
$.gchart.noteIcon('2010 Q1', 'Big sales', 'taped',
	false, '', 'blue', 2, 3, 1.0)

$.gchart.weatherIcon('', 'Rain', '', 'rain')
$.gchart.weatherIcon('City', '22-29°C', 'taped',
	'thunder', 2, 3, 1.0)

$.gchart.outlineIcon('Here it is')
$.gchart.outlineIcon('Over here', 20, true, '',
	'yellow', 'red', 2, 3, 1.0)

$.gchart.colorVaryIcon('flag', 1)
$.gchart.colorVaryIcon('book', 2, ['white', 'yellow', 'red'], 24, 'blue',
	$.gchart.contextualAlignment('center'), 2, 3, 1.0)

$.gchart.sizeVaryIcon('disk', 1)
$.gchart.sizeVaryIcon('book', 2, [6, 12, 8], 'yellow', 'blue',
	$.gchart.contextualAlignment('center'), 2, 3, 1.0)

$.gchart.colorSizeVaryIcon('flag', 1, 2)
$.gchart.colorSizeVaryIcon('book',
	2, ['white', 'yellow', 'red'], 3, [6, 12, 8], 'blue',
	$.gchart.contextualAlignment('center'), 2, 3, 1.0)

$.gchart.stackingIcon('flag', 1)
$.gchart.stackingIcon('book', 2, 5, 16, 'yellow', 'blue', 2,
	$.gchart.contextualAlignment('top'), 2, 3, 1.0)

$.gchart.stackingColorVaryIcon('flag', 1, 2)
$.gchart.stackingColorVaryIcon('book',
	2, 5, 16, ['yellow', 'orange', 'red'], 'blue', 2,
	$.gchart.contextualAlignment('top'), 2, 3, 1.0)

$.gchart.contextualAlignment('center')
$.gchart.contextualAlignment('topLeft', 10)
$.gchart.contextualAlignment('br', -10, -20)

var embedded = {type: 'pie',
	series: [$.gchart.series([10, 20, 30])],
	dataLabels: ['Q1', 'Q2', 'Q3']}
$.gchart.embeddedChart(embedded, 1, 7)
$.gchart.embeddedChart(embedded, 'center', 1, 7)
$.gchart.embeddedChart(embedded, true, 'bottomRight',
	2, '#808000', '#ffffcc' 1, 7)

var axisName = axis.axis();
axis.axis('bottom');

var lineColour = axis.color();
axis.color('blue');

var labels = axis.labels();
axis.labels(['2006', '2007', '2008']);

var posns = axis.positions();
axis.positions([10, 50, 90]);

var range = axis.range();
axis.range(200, 400, 40);

var style = axis.style();
axis.style('red', 'right', 20);

var drawing = axis.drawing();
axis.drawing('ticks');

var ticks = axis.ticks();
axis.ticks('blue', -10);

var format = axis.format();
axis.format($.gchart.formatFloat, 3);