Skip to main content
v2.2

Area

Basic area type, which renders the area space below the data points.

Area SeriesArea Series

Creating Area series​

series = chart.add_area_series()

Adding Data​

Add XY Data​

There are many different ways you can add data to an Area series. The most basic way is to specify two lists of number values, one for X coordinates, and another for Y coordinates.

# Using x and y lists:
x_values = [0, 1, 2, 3]
y_values = [1, 3, 2, 4]
series.add(x_values, y_values)

Another common way of adding data is to read from a list of dictionaries/JSON-like objects:

# Using a list of dictionaries:
data_points = [
    {'x': 0, 'y': 1},
    {'x': 1, 'y': 3},
    {'x': 2, 'y': 2},
    {'x': 3, 'y': 4}
]
series.add(data=data_points)

Please refer to Adding Data to Charts section to see other available ways of adding data to a series.

Schema and Data Mapping​

This section works the same as for Line, to avoid duplication of guides, please refer to the section under Line

Customizing Fill Coloring​

Solid Fill Color​

series.set_fill_color((255, 0, 0))
series.set_fill_color('#FF0000')
series.set_fill_color('red')

Set Palette Coloring​

series.set_palette_area_coloring(
    steps=[
        {'value': 0, 'color': '#ADD8E6', 'label': 'Min'},
        {'value': 50, 'color': '#0000FF'},
        {'value': 100, 'color': '#00008B', 'label': 'Max'},
    ],
    look_up_property='value',
    interpolate=True
)

Customizing Line Appearance​

You can also customize the line that outlines the area.

Changing Line Color​

Using individual line color:

series.set_line_color((255, 0, 0))
series.set_line_color('#FF0000')
series.set_line_color('red')

Changing Line Thickness​

series.set_line_thickness(3)

Changing Line Pattern​

series.set_dashed(pattern="Dashed", thickness=2, color='green')

Available patterns include: "DashDotted", "Dashed", "DashedEqual", "DashedLoose", "Dotted", and "DottedDense".

Series Utility Methods​

This section works the same as for Line, to avoid duplication of guides, please refer to the section under Line

Legend​

Please see common legend section.

Examples​

Link to the examples