All Collections
Visualize Your Data
Visualize Your Data - Creating custom charts
Visualize Your Data - Creating custom charts

This article explains how to create and manage Custom Charts in ClearPoint.

F
Written by Fernando Montenegro
Updated over a week ago

Don’t see your ideal chart as a default option in ClearPoint? We leverage a charting library that might be able to create exactly what you are looking for. With Custom Charts you can add an extra layer of customization to your charts.


Use a Custom Chart from the JSON Chart Library

The JSON chart library has a collection of charts that cover some of the more popular customizations we see. Use one of these charts as a starting point for your perfect chart.

  • Select Scorecards & Elements from the Control Panel

  • Choose Manage Elements

  • Open Measures

  • Select the Measure you are going to be working with, in this example, ‘Revenue’.

  • Double-click on the Chart you would like to edit

  • Select Custom Chart JSON from the Chart Type dropdown menu

    • Remove the existing JSON that is in the field to start with a blank slate.

  • Choose one of the existing Custom Chart JSON Templates

  • Click Save on Edit Chart JSON

  • Click on Refresh Preview

  • Once you are done with your changes, click Save


Add a Custom Chart to your predefined Charts

  • Select Scorecards & Elements from the Control Panel

  • Choose Manage Elements

  • Open Measures

  • Select the Measure you are going to be working with, in this example, ‘Revenue’.

  • Double-click on the Chart you would like to edit

  • Select Custom Chart JSON from the Chart Type dropdown menu

    • Select and delete all predefined text on this field

  • Choose one of the existing Custom Chart JSON Templates

  • Click on Add Custom Chart Type

  • Under Name, enter the name of your new Custom Chart

  • Click the Add button

  • Click on Save on Add Custom Chart Type

  • Click Save on Edit Chart JSON

  • Click on Refresh Preview

  • Once you are done with your changes, click Save

    • Moving forward, you will be able to find the new Custom Chart as part of your Chart Library


Edit a Custom Chart

In this example, we are going to change the background color of a Custom Chart.

  • Select Scorecards & Elements from the Control Panel

  • Choose Manage Elements

  • Open Measures

  • Select the Measure you are going to be working with, in this example, ‘Revenue’.

  • Double-click on the Chart you would like to edit

  • Select Custom Chart JSON from the Chart Type dropdown menu

  • Locate “backgroundColor” in the JSON file and update the RGBA code to "rgba(211, 211, 211)"

  • Click Save on Edit Chart JSON

  • Click on Refresh Preview

  • Once you are done with your changes, click Save


How to Create a New Custom Chart from System Setup

  • Click on System Settings from the Control Panel

  • Select System setup

  • Click on Advanced & Custom Charts under Professional Features

  • Click on the Plus icon

  • Under Chart Format Name, enter the name of the new Custom Chart, in this example, “New Custom Chart”

  • From here you can use an existing Custom Chart JSON Template and customize it

  • You can also enter a Custom JSON Chart, you can use Highcharts to generate your chart.

    • For example, we are going to use:

      {

    "chart": {

    "borderColor": "#008080",

    "borderWidth": 2,

    "type": "bar"

    }

    }

  • Click Save on Custom Chart Type

  • Once you are done with your changes, click Save


Editing a Custom Chart in System Setup

  • Click on System Settings from the Control Panel

  • Select System setup

  • Click on Advanced & Custom Charts under Professional Features

  • Locate the Custom Chart you want to edit

  • Click the edit Pencil icon

  • Edit the JSON file, in this example, we are going to change the Type to Line

  • Click Save on Custom Chart Type

  • Once you are done with your changes, click Save

Did this answer your question?