seamlessly integrates with Google Charts
for convenient tabular data visualization via
ui.Chart functions. Charts can
be displayed interactively in the Code Editor console,
widgets, and in stand-alone browser tabs.
Earth Engine uses the Google Visualization API
to support charting. The API accepts a
DataTable, which is a 2-D
table where rows are observations and columns are observation attributes.
All charts in Earth Engine are derived from a
allows you to supply a
DataTable directly. It affords the greatest opportunity
for chart customization, but may be less convenient than methods for charting
specific Earth Engine objects (see the following section). Learn more about
creating charts from a
Earth Engine object charts
ui.Chart widget provides helper methods to construct a
render charts from
List objects. Each function accepts a specific data type and
includes methods for reducing the data to tabular format in a variety of
arrangements that dictate data assignment to chart series and axes.
Visit the following links to learn how to generate a chart for each data type:
A variety of chart types can be produced; for example: scatter, line, bar, pie,
and histogram. Specifically, any chart type that is available in the Google
package can be generated. Use the
method to set chart type. Each page linked to in the
Earth Engine object charts and
DataTable charts sections include examples for generating
several chart types.
Use the following strings as input to the
'ScatterChart' 'LineChart' 'ColumnChart' 'BarChart' 'PieChart' 'AreaChart'
Here is an example:
var data = ee.List([0, 1, 2, 3, 4, 5]); var chart = ui.Chart.array.values(data, 0, data) .setChartType('ColumnChart'); print(chart);
Display and download
ui.Chart widgets can be displayed three ways:
- In the Code Editor console
var data = ee.List([0, 1, 2, 3, 4, 5]); var chart = ui.Chart.array.values(data, 0, data); print(chart);
- In a
var data = ee.List([0, 1, 2, 3, 4, 5]); var chart = ui.Chart.array.values(data, 0, data); var chartPanel = ui.Panel(chart); Map.add(chartPanel);
- In a separate browser tab; click the pop-out icon
ui.Chartwidget. The new page provides a full-window display and options to download the chart as a graphic (PNG or SVG) or a CSV file of the underlying data.
) in the
upper-right corner of a displayed
Charts are interactive by default. Hover over points, lines, bars, etc. to see respective x, y, and series values. Axis zooming and panning are optionally permitted by activating a chart's "explorer" functionality.
Google Charts are highly customizable via styling properties. Use the
ui.Chart.setOptions() method to set chart style properties. See the
Chart Styling guide for full details.
ui.Chart functions will only render 5,000 features. If your
List has more elements,
consider ways you might limit the data. If you have a long time series with a
high cadence rate, try using a shorter time period, temporal sampling, or
generate temporal composites. If the issue is spatial, try using a random
subset. If you are working with pixels in a list or array, try using a slightly
larger scale or smaller region.
Long-running computations can fail to generate a chart because of interactive response limits of the Code Editor. If your chart request times out, try exporting intermediate steps of your analysis and regenerating the chart from the exported assets.