Results:
Loading...

JavaScript Charts: Background

This section describes how to change the background of a chart.

Background Fill

background.fill property accepts a colour string value.

background: {
    fill: 'rgb(63, 127, 255)',
},

Background Image

The url is required for the background image.

It is positioned in the center by default. The left, top, right and bottom properties specify the distance between the chart borders and the image. The width and height properties override the size of the image.

background: {
    image: {
        url: 'data:image/png;base64,iVBORw0...',
        width: 50,
        height: 50,
        right: 10,
        bottom: 10,
    },
},

API Reference

Properties available on the AgChartBackground interface.

visible
boolean
Whether or not the background should be visible.
fill
CssColor
Colour of the chart background.
fill: CssColor;

type CssColor = string

Next Up

Continue to the next section to learn more about overlays.