• ‘linear’ – Constant speed.
• ‘in’ – Ease in – Start slow and speed up.
• ‘out’ – Ease out – Start fast and slow down.
• ‘inAndOut’ – Ease in and out – Start slow, speed up, then slow down.

property.

• in – Draw the axis titles inside the the chart area.
• out – Draw the axis titles outside the chart area.
• none – Omit the axis titles.

or

, or an object with the following properties.

.

• ‘datum’ – Focus on a single data point. Correlates to a cell in the data table.
• ‘category’ – Focus on a grouping of all data points along the major axis. Correlates to a row in the data table.

In focusTarget ‘category’ the tooltip displays all the category values. This may be useful for comparing values of different series.

 {title: 'Hello',  titleTextStyle: {color: '#FF0000'}}

axis.

or

.This option is only supported for a

axis.

to reverse the order of the values.

will display values “1,000%”, “750%”, and “50%” for values 10, 7.5, and 0.5.For date axis labels, this is a subset of the date formatting ICU pattern set. For instance,

will display the value “Jul 1, 2011” for the date of July first in 2011.

The actual formatting applied to the label is derived from the locale the API has been loaded with. For more details, see loading charts with a specific locale.

This option is only supported for a

axis.

 {color: '#333', count: 4}

This option is only supported for a

axis.

axis.

property that makes the horizontal axis a logarithmic scale (requires all values to be positive). Set to true for yes.This option is only supported for a

axis.

 {color: <string>, fontName: <string>, fontSize: <number>}

The

can be any HTML color string, for example:

or

. Also see

and

.

property that specifies the title of the horizontal axis.

 {color: <string>, fontName: <string>, fontSize: <number>}

The

can be any HTML color string, for example:

or

. Also see

and

.

axis.

is set to ‘out’ (which is the default).This option is only supported for a

axis.

is

, or is in auto mode, and the chart decided to draw the text horizontally.This option is only supported for a

axis.

axis.

axis.

axis.

axis.

property that specifies the highest horizontal axis grid line. The actual grid line will be the greater of two values: the

option value, or the highest data value, rounded up to the next higher grid mark.This option is only supported for a

axis.

property that specifies the lowest horizontal axis grid line. The actual grid line will be the lower of two values: the

option value, or the lowest data value, rounded down to the next lower grid mark.This option is only supported for a

axis.

is null, ‘explicit’ otherwise

• ‘pretty’ – Scale the horizontal values so that the maximum and minimum data values are rendered a bit inside the left and right of the chart area.
• ‘maximized’ – Scale the horizontal values so that the maximum and minimum data values touch the left and right of the chart area.
• ‘explicit’ – Specify the left and right scale values of the chart area. Data values outside these values will be cropped. You must specify an
  hAxis.viewWindow

  object describing the maximum and minimum values to show.

This option is only supported for a

axis.

• For a
  continuous

  axis:
  The maximum horizontal data value to render. Has an effect only if

  hAxis.viewWindowMode='explicit'

  .

• For a
  discrete

  axis:
  The zero-based row index where the cropping window ends. Data points at this index and higher will be cropped out. In conjunction with

  vAxis.viewWindowMode.min

  , it defines a half-opened range [min, max) that denotes the element indices to display. In other words, every index such that

  min <= index < max

  will be displayed.

• For a
  continuous

  axis:
  The minimum horizontal data value to render. Has an effect only if

  hAxis.viewWindowMode='explicit'

  .

• For a
  discrete

  axis:
  The zero-based row index where the cropping window begins. Data points at indices lower than this will be cropped out. In conjunction with

  vAxis.viewWindowMode.max

  , it defines a half-opened range [min, max) that denotes the element indices to display. In other words, every index such that

  min <= index < max

  will be displayed.

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}

• ‘right’ – To the right of the chart. Incompatible with the
  vAxes

  option.

• ‘top’ – Above the chart.
• ‘bottom’ – Below the chart.
• ‘in’ – Inside the chart, by the top left corner.
• ‘none’ – No legend is displayed.

• ‘start’ – Aligned to the start of the area allocated for the legend.
• ‘center’ – Centered in the area allocated for the legend.
• ‘end’ – Aligned to the end of the area allocated for the legend.

Start, center, and end are relative to the style — vertical or horizontal — of the legend. For example, in a ‘right’ legend, ‘start’ and ‘end’ are at the top and bottom, respectively; for a ‘top’ legend, ‘start’ and ‘end’ would be at the left and right of the area, respectively.

The default value depends on the legend’s position. For ‘bottom’ legends, the default is ‘center’; other legends default to ‘start’.

 {color: <string>, fontName: <string>, fontSize: <number>}

The

can be any HTML color string, for example:

or

. Also see

and

.

property.

property.

axis.

• color

  – The color to use for this series. Specify a valid HTML color string.

• targetAxisIndex

  – Which axis to assign this series to, where 0 is the default axis, and 1 is the opposite axis. Default value is 0; set to 1 to define a chart where different series are rendered against different axes. At least one series much be allocated to the default axis. You can define a different scale for different axes.

• pointSize

  – Overrides the global

  pointSize

  value for this series.

• lineWidth

  – Overrides the global

  lineWidth

  value for this series.

• areaOpacity

  – Overrides the global

  areaOpacity

  for this series.

• visibleInLegend

  – A boolean value, where true means that the series should have a legend entry, and false means that it should not. Default is true.

You can specify either an array of objects, each of which applies to the series in the order given, or you can specify an object where each child has a numeric key indicating which series it applies to. For example, the following two declarations are identical, and declare the first series as black and absent from the legend, and the fourth as red and absent from the legend:

series: [{color: 'black', visibleInLegend: false},{}, {}, {color: 'red', visibleInLegend: false}]
series: {0:{color: 'black', visibleInLegend: false}, 3:{color: 'red', visibleInLegend: false}}

• ‘maximized’ – Maximizes the area of the chart, and draws the legend and all of the labels inside the chart area. Sets the following options:

  chartArea: {width: '100%', height: '100%'},
  legend: {position: 'in'},
  titlePosition: 'in', axisTitlesPosition: 'in',
  hAxis: {textPosition: 'in'}, vAxis: {textPosition: 'in'}

• in – Draw the title inside the chart area.
• out – Draw the title outside the chart area.
• none – Omit the title.

 {color: <string>, fontName: <string>, fontSize: <number>}

The

can be any HTML color string, for example:

or

. Also see

and

.

 {textStyle: {color: '#FF0000'}, showColorCode: true}

is set to ‘category’, otherwise the default is false.

 {color: <string>, fontName: <string>, fontSize: <number>}

The

can be any HTML color string, for example:

or

. Also see

and

.

• ‘focus’ – The tooltip will be displayed when the user hovers over an element.
• ‘none’ – The tooltip will not be displayed.

object, and can contain all the properties supported by

. These property values override any global settings for the same property.To specify a chart with multiple vertical axes, first define a new axis using

, then configure the axis using

. The following example assigns series 2 to the right axis and specifies a custom title and text style for it:

This property can be either an object or an array: the object is a collection of objects, each with a numeric label that specifies the axis that it defines–this is the format shown above; the array is an array of objects, one per axis. For example, the following array-style notation is identical to the

object shown above:

vAxes:[
{}, // Nothing specified for axis 0
{title:'Losses',textStyle:{color: 'red'}} // Axis 1
]

 {title: 'Hello', titleTextStyle: {color: '#FF0000'}}

property that specifies the baseline for the vertical axis. If the baseline is larger than the highest grid line or smaller than the lowest grid line, it will be rounded to the closest gridline.

or

.

to reverse the order of the values.

will display values “1,000%”, “750%”, and “50%” for values 10, 7.5, and 0.5.The actual formatting applied to the label is derived from the locale the API has been loaded with. For more details, see loading charts with a specific locale.

 {color: '#333', count: 4}

 {color: <string>, fontName: <string>, fontSize: <number>}

The

can be any HTML color string, for example:

or

. Also see

and

.

property that specifies a title for the vertical axis.

 {color: <string>, fontName: <string>, fontSize: <number>}

The

can be any HTML color string, for example:

or

. Also see

and

.

property that specifies the highest vertical axis grid line. The actual grid line will be the greater of two values: the

option value, or the highest data value, rounded up to the next higher grid mark.

property that specifies the lowest vertical axis grid line. The actual grid line will be the lower of two values: the

option value, or the lowest data value, rounded down to the next lower grid mark.

is null, ‘explicit’ otherwise

• ‘pretty’ – Scale the vertical values so that the maximum and minimum data values are rendered a bit inside the top and bottom of the chart area.
• ‘maximized’ – Scale the vertical values so that the maximum and minimum data values touch the top and bottom of the chart area.
• ‘explicit’ – Specify the top and bottom scale values of the chart area. Data values outside these values will be cropped. You must specify a
  vAxis.viewWindow

  object describing the maximum and minimum values to show.

.

.