Fine-Tune a Chart with Advanced Settings

Last modified: November 19, 2024

Introduction

The individual Charts widgets can be fine-tuned with advanced settings. The settings can affect the layout, configuration and data.

This how-to teaches you how to do the following:

Before starting this how-to, make sure you have completed the following prerequisites:

This is what the original chart looks like:

To create a custom layout, follow these steps:

In the Layout section add the following Custom setting:

{
  "font": {
    "family": "Open Sans",
    "size": 14,
    "color": "#555"
  }
}

Change the font settings till the chart shows the required font. Copy the font settings.

Please note that changes made in the editor will not persist unless they are stored in the advanced settings of the widget or in the theme.

After making some changes, the chart looks like this:
Paste the new font settings into the Layout options property in the Advanced tab.
Change the Mode back to Advanced in Studio Pro, this will remove the Toggle Editor button from the chart.

Please note that the advanced settings only apply to the chart in Advanced or Developer mode.

This is what the chart looks like before making any changes:

To create a custom configuration, follow these steps:

Repeat steps 1 to 8 from the layout instructions.
Select the name of the series you want to display differently from the drop-down menu: in this case Series 1.
Edit the Custom settings; change them to { "type": "line" }.
Copy the custom settings.
In Studio Pro, open the Series 1 configuration.
Paste the new configuration for the data into the (Layout) Options property in the Advanced tab.

After the changes, the chart looks like this:

To create custom a configuration, follow these steps:

Repeat steps 1 to 8 from the layout instructions.
Select Configuration from the drop-down menu.
Edit the Custom settings, change them to { "displayModeBar": true }.
Add more Custom settings as desired. See here for more configuration settings.
The changes made in the editor are not persistable; copy the required settings.
Paste the new configuration into the Configuration options property in the Advanced tab.
Change Mode to Advanced, set Studio Pro to remove the Toggle Editor button.

Please note that the advanced settings only apply to the chart in Advanced or Developer mode