Class Charts

    • The Charts service is the entry point for creating charts in scripts.

    • You can create various chart types like Area, Bar, Column, Line, Pie, Scatter, and Table charts using this service.

    • Data for charts is held in a DataTable, which can be built manually.

    • Charts can be added to a web page as an image.
    Charts

    Entry point for creating Charts in scripts.

    This example creates a basic data table, populates an area chart with the data, and adds it into a web page as an image:

     function 
  
 doGet 
 () 
  
 { 
  
 const 
  
 data 
  
 = 
  
 Charts 
 . 
 newDataTable 
 () 
  
 . 
 addColumn 
 ( 
 Charts 
 . 
 ColumnType 
 . 
 STRING 
 , 
  
 'Month' 
 ) 
  
 . 
 addColumn 
 ( 
 Charts 
 . 
 ColumnType 
 . 
 NUMBER 
 , 
  
 'In Store' 
 ) 
  
 . 
 addColumn 
 ( 
 Charts 
 . 
 ColumnType 
 . 
 NUMBER 
 , 
  
 'Online' 
 ) 
  
 . 
 addRow 
 ([ 
 'January' 
 , 
  
 10 
 , 
  
 1 
 ]) 
  
 . 
 addRow 
 ([ 
 'February' 
 , 
  
 12 
 , 
  
 1 
 ]) 
  
 . 
 addRow 
 ([ 
 'March' 
 , 
  
 20 
 , 
  
 2 
 ]) 
  
 . 
 addRow 
 ([ 
 'April' 
 , 
  
 25 
 , 
  
 3 
 ]) 
  
 . 
 addRow 
 ([ 
 'May' 
 , 
  
 30 
 , 
  
 4 
 ]) 
  
 . 
 build 
 (); 
  
 const 
  
 chart 
  
 = 
  
 Charts 
 . 
 newAreaChart 
 () 
  
 . 
 setDataTable 
 ( 
 data 
 ) 
  
 . 
 setStacked 
 () 
  
 . 
 setRange 
 ( 
 0 
 , 
  
 40 
 ) 
  
 . 
 setTitle 
 ( 
 'Sales per Month' 
 ) 
  
 . 
 build 
 (); 
  
 const 
  
 htmlOutput 
  
 = 
  
 HtmlService 
 . 
 createHtmlOutput 
 (). 
 setTitle 
 ( 
 'My Chart' 
 ); 
  
 const 
  
 imageData 
  
 = 
  
 Utilities 
 . 
 base64Encode 
 ( 
 chart 
 . 
 getAs 
 ( 
 'image/png' 
 ). 
 getBytes 
 ()); 
  
 const 
  
 imageUrl 
  
 = 
  
 `data:image/png;base64, 
 ${ 
 encodeURI 
 ( 
 imageData 
 ) 
 } 
 ` 
 ; 
  
 htmlOutput 
 . 
 append 
 ( 
 'Render chart server side: <br/>' 
 ); 
  
 htmlOutput 
 . 
 append 
 ( 
 `<img border="1" src=" 
 ${ 
 imageUrl 
 } 
 ">` 
 ); 
  
 return 
  
 htmlOutput 
 ; 
 }

    Properties

    Property Type Description
    Chart Hidden Dimension Strategy
    		Chart Hidden Dimension Strategy An enumeration of how hidden dimensions in a source are expressed in a chart.
    Chart Merge Strategy
    		Chart Merge Strategy An enumeration of how multiple ranges in the source are expressed in a chart.
    Chart Type
    		Chart Type An enumeration of chart types supported by the Charts service.
    Column Type
    		Column Type An enumeration of the valid data types for columns in a Data Table .
    Curve Style
    		Curve Style An enumeration of the styles for curves in a chart.
    Point Style
    		Point Style An enumeration of the styles of points in a line.
    Position
    		Position An enumeration of legend positions within a chart.

    Methods

    Method Return type Brief description
    new Area Chart()
    		Area Chart Builder Starts building an area chart, as described in the Google Chart Tools documentation.
    new Bar Chart()
    		Bar Chart Builder Starts building a bar chart, as described in the Google Chart Tools documentation.
    new Column Chart()
    		Column Chart Builder Starts building a column chart, as described in the Google Chart Tools documentation.
    new Data Table()
    		Data Table Builder Creates an empty data table, which can have its values set manually.
    new Data View Definition()
    		Data View Definition Builder Creates a new data view definition.
    new Line Chart()
    		Line Chart Builder Starts building a line chart, as described in the Google Chart Tools documentation.
    new Pie Chart()
    		Pie Chart Builder Starts building a pie chart, as described in the Google Chart Tools documentation.
    new Scatter Chart()
    		Scatter Chart Builder Starts building a scatter chart, as described in the Google Chart Tools documentation.
    new Table Chart()
    		Table Chart Builder Starts building a table chart, as described in the Google Chart Tools documentation.
    new Text Style()
    		Text Style Builder Creates a new text style builder.

    Detailed documentation

    new Area Chart()

    Starts building an area chart, as described in the Google Chart Tools documentation.

    Return

    Area Chart Builder — An AreaChartBuilder, which can be used to build an area chart.

    new Bar Chart()

    Starts building a bar chart, as described in the Google Chart Tools documentation.

    Return

    Bar Chart Builder — A BarChartBuilder, which can be used to build a bar chart.

    new Column Chart()

    Starts building a column chart, as described in the Google Chart Tools documentation.

    Return

    Column Chart Builder — A ColumnChartBuilder, which can be used to build a column chart.

    new Data Table()

    Creates an empty data table, which can have its values set manually.

    Data tables hold the data for all chart types.

    Return

    Data Table Builder — A DataTableBuilder, which can hold data for charts.

    new Data View Definition()

    Creates a new data view definition.

    Use setters to define the different properties of the data view.

    Return

    Data View Definition Builder — A DataViewDefinitionBuilder, which can be used to build a data view definition.

    new Line Chart()

    Starts building a line chart, as described in the Google Chart Tools documentation.

    Return

    Line Chart Builder — A LineChartBuilder, which can be used to build a line chart.

    new Pie Chart()

    Starts building a pie chart, as described in the Google Chart Tools documentation.

    Return

    Pie Chart Builder — A PieChartBuilder, which can be used to build a pie chart.

    new Scatter Chart()

    Starts building a scatter chart, as described in the Google Chart Tools documentation.

    Return

    Scatter Chart Builder — A ScatterChartBuilder, which can be used to build a scatter chart.

    new Table Chart()

    Starts building a table chart, as described in the Google Chart Tools documentation.

    Return

    Table Chart Builder — A TableChartBuilder, which can be used to build a table chart.

    new Text Style()

    Creates a new text style builder.

    To change the default values, use the setter functions.

    Return

    Text Style Builder — A TextStyleBuilder, which can be used to build a text style configuration object.
    Design a Mobile Site
    View Site in Mobile | Classic
    Share by: