Skip to main content

How to add a watermark to your chart

There are two ways to watermark your chart:

Option 1: Background image

Use the backgroundImageUrl Chart.js plugin. This will place an image in the background of your chart. You can supply a watermark image that contains, for example, the logo of your company.

See background image documentation and an example chart.

Option 2: Watermark API

The watermark API is more flexible and provides more customization options. Supply the chart URL as the mainImageUrl query parameter, and supply a separate watermark image as markImageUrl. This option is more customizable.

Here's an example chart created using the watermark API technique:

An image watermarked with the API

As you can see, we've set mainImageUrl, markImageUrl, and a couple other optional parameters:

Be sure to URL-encode your mainImageUrl and markImageUrl parameters.