Line chart
Displays time series or indexed point data. The vAxisMinValue and vAxisMaxValue are used as the range instead of the min/max from the data.
If padRight is set to true than the chart is padded on the right with the same space as what is used for the second axis legend. This allows for two or more charts to be aligned that have one or more fields being displayed.
{{display_linechart width="800"  height="400"  
fields=""       
vAxisMinValue="0" vAxisMaxValue="1.0" padRight="true"}}
 Line chart
Image 1: Line chart
You can set various colors of the chart with the following properties:
chart.fill="color or 'transparent'"
chart.stroke="stroke color"
chart.strokeWidth="width"

chartArea.fill="color or 'transparent'"
chartArea.stroke="stroke color"
chartArea.strokeWidth="width"

hAxis.gridlines.color="color"
vAxis.gridlines.color="color"

Annotating Charts
Annotations for a chart can be specified in two ways. The first is to specify one or more data fields to create the annotation from:
  annotationFields="field1,field2,..."
  annotationLabelField="field" //optional for the label
The second way is to specify the annotations using an annotations attribute:
annotations="
<,index1>,label1,description1;
<,index2>,label2,description2;
...
"
Where <index> is either a date or a numeric index, e.g;
 annotations="
2,A,annotation 1;
2016-06-24,B,annotation 2;
2016-06-24,C,<,h1>,annotation 3</h1>
2017-01-02,D,annotation 4
"
Bar chart
{{display_barchart fields=""  padRight="true"}}
Bar chart
Image 2: Bar chart
Stacked bar chart
{{display_barstack fields=""}}
Area chart
{{display_areachart width="800"  height="400"  
fields=""  
vAxisMinValue="0" vAxisMaxValue="1.0" 
padRight="true"
isStacked="true"}}
Area chart
Image 3: Area chart
Scatter Plot
{{display_scatterplot width="800"  height="400"  fields=""}}
 Scatter Plot
Image 4: Scatter Plot
Histogram
The minValue and maxValue attributes are used to specify the maximum and minimum evertical data value to render. More info at Google charts histogram documentation.
{{display_histogram width="800"  height="400"  fields=""  
colors="comma separated color list"  
legendPosition="none|top|right|left|bottom"  
textPosition="out|in|none"  
isStacked="false|true|percent|relative"  
logScale="true|false"  scaleType="log|mirrorLog"  
vAxisMinValue=""  vAxisMaxValue=""  
minValue=""  maxValue=""}}
 Histogram
Image 5: Histogram
Bubble Chart
The fields specify a text field for the label and the numeric value fields used for the x and y axis, the bubble color and bubble size.
{{display_bubble width="500"  height="500"  
fields="label|x|y|color|size"  
colorTable=""  
colors="comma separated color list"  
legendPosition="none|top|right|left|bottom"  
hAxisFormat="none|decimal|scientific|percent|short|long"  
vAxisFormat="none|decimal|scientific|percent|short|long"  
hAxisTitle=""  
vAxisTitle=""}}
Example
Pie chart
More info at Google charts pie chart documentation
{{display_piechart fields=""
pieHole="0.5"  
is3D="true"    
bins="bin count"  
binMin="min"  
binMax="max"  
sliceVisibilityThreshold="0.01"  
width="500"  height="250"}}
 Pie chart
Image 6: Pie chart
Radar Display
{{display_radar fields=""}}
Example
Radar Display
Image 7: Radar Display
Wind Rose
{{display_windrose fields=""}}
Example
Wind Rose
Image 8: Wind Rose
Density Display
{{display_density fields="tmax,vp"}}
Example
Density Display
Image 9: Density Display
3D Scatter
{{display_3dscatter fields=""}}
Example
3D Scatter
Image 10: 3D Scatter
Calendar
Displays point data based on the date of each record. The calendar entry is color coded based on the specified field.
If missingValue is specified than any point value with that value won't be shown.
{{display_calendar fields=""  cellSize="15"  missingValue="0"}}
 Calendar
Image 11: Calendar
Gauge
This shows a single value from a series of point data.
{{display_gauge fields=""  gaugeMin=""  gaugeMax=""  gaugeLabel=""}}
 Gauge
Image 12: Gauge