Add Background Image To Charts

[intapiuser]

SET THE BACKGROUND OF CHARTS TO AN IMAGE

Open the script editor for a widget, and copy in the following code:

widget.on('render', function(sender,event){
 
 // URL to the background Image
 var imageLink = 'http://siliconangle.com/files/2014/12/BlackWhite-Logo.jpg'
 
 // Set the chart background as the image
 sender.queryResult.chart.plotBackgroundImage = imageLink;
  
})

Change the imageLink variable to the path of your image, and hit save.  Reload the web page and you should see an image as the background of your widget.

This functionality works only with the following chart types: scatter, pie, column, bar, line, area, & polar

[Jordy]

Hi,

We're using the following script to achieve a similar result:

widget.on("beforeviewloaded", (scope, args) => {
console.log(args);
args.options.chart.plotBackgroundImage = imaglink;

});

Both ways work for the widget, but the image export function suddenly forgets that it still has to apply filters to the widget, resulting in the background image being loaded, but also way too much data.

Did you find a way to overcome that issue?

- J

[DRay]

Hello @Jordy,

First of all, I know this answer has taken a while. These posts from intapiuser were created by an automated migration and are not monitored.

That's a great question. If you haven't found an answer yet, please post this in the Build Analytics Discussions section. We are happy to help you there.

Have a great day!