Chart Overview

Earth Engine uses the Google Visualization API to provide support for charting in the ui.Chart class. Charts can be displayed interactively through the Code Editor console, added to user interface components, viewed as separate web pages, or exported as images. Note that ui.Chart is only available in the Code Editor (not in the JavaScript or Python client libraries).

The data used to create a chart is stored in a DataTable object which contains a schema for the table columns and data stored in the table rows. Consider the following table of airport elevations:

// Define a DataTable using a JavaScript literal.
var dataTable = {
  cols: [{id: 'name', label: 'Airport Code', type: 'string'},
         {id: 'year', label: 'Elevation (m)', type: 'number'}],
  rows: [{c: [{v: 'SFO'}, {v: 4}]},
         {c: [{v: 'JFK'}, {v: 4}]},
         {c: [{v: 'DEN'}, {v: 1655}]},
         {c: [{v: 'LHR'}, {v: 25}]},
         {c: [{v: 'ZRH'}, {v: 432}]}]

Customize chart styles with a dictionary of options, for example:

// Define a dictionary of customization options.
var options = {
  title: 'Airport elevations',
  vAxis: {title: 'Airport Code'},
  legend: {position: 'none'},
  hAxis: {
    title: 'Elevation (m)',
    logScale: true

Using the constructor, create the chart and print it to display it in the console:

// Make a BarChart from the table and the options.
var chart = new ui.Chart(dataTable, 'BarChart', options);

// Print the chart to display it in the console.

For a larger, exportable version of the chart, click the pop-out icon () in the upper right corner of the chart in the console. On the pop-up page there are options to download the chart as an SVG file or PNG file, or get the underlying data as a CSV file.

The DataTable constructor is provided for flexibility in charting, but other charting methods create the input table for you. Specify the data in a ui.Chart by Image, ImageCollection, FeatureCollection or Array inputs. Specify a region and reducer to aggregate the input data before charting. The pages in the charting section contain examples of making charts with different types of inputs and reducers.