Dashboard Elements

In addition to charts, you can add other elements to your dashboard to enhance it such as Rulers, Links, Images, and Text.

Ruler

Add rulers to format and delimit sections on your dashboard. To do this, click on Add Ruler from the dashboard’s side menu. A pop-up will open and prompt you to select if you would like it to be Bolded, choose the ruler’s orientation, as well as add a background color if you’d like.

To resize the length of the ruler, hover over the right side of the ruler until a directional arrow appears. Click and drag the ruler to the right to expand it or to the left to shorten it.

Chartio ruler

You can also move the ruler as you would a chart or copy it by selecting Clone from the Ruler’s dropdown menu.

To add hyperlinked text within your dashboard, click on the Add Link option on the dashboard sidebar menu.

Within the pop-up, the Display Text box should contain text to be hyperlinked and displayed on your dashboard. The Url can link to other Chartio dashboards or to external sources which will be opened in a new tab. You can also set custom Font style as well as Text and Background Colors.

adding a link

To insert a dashboard variable into your URL, simply add the variable name in curly braces to the URL field.

inserting dashboard variable

Note: You can also create custom hyperlinked columns within your charts by following one of the options here.

Image

Click Add Image from the dashboard sidebar menu to add an image to any dashboard. Images can be resized similarly to other dashboard elements by dragging the bottom right of the image.

Before an image can be uploaded to a dashboard, the image must be saved locally. You can also use the Add Image element to add GIFs or short videos to your dashboards.

Text

Click Add Text from the dashboard sidebar menu to add a text element to the dashboard. A modal will pop up for you to input your text and customize your text settings.

You can enable the Markdown toggle to use Markdown within the text settings. However, markdown text will not be displayed in the PDF is the dashboard is downloaded. This is because markdown is rendered in your browser and our PDF downloads are generated on our server and will not render the markdown text.

The supported markdown syntax are listed below:

Supported markdown syntax

Phrase emphasis

*italic* and **bold**
_also italics_ and __also bold__
[link text](https://chartio.com)
Or <https://chartio.com>

Headings

Markdown supports two styles of headers, Setext and atx.

Setext-style headers are “underlined” using equal signs (for first-level headers) and dashes (for second-level headers). For example:

This is an H1
=============

This is an H2
-------------

Any number of underlining =’s or -’s will work.

Atx-style headers use 1-6 hash characters at the start of the line, corresponding to header levels 1-6. For example:

# Heading 1
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6

Lists

Ordered

Ordered lists use numbers followed by periods:

An ordered list:

 1. first
 2. second
 3. third

Unordered

Unordered lists use asterisks, pluses, and hyphens — interchangeably — as list markers:

An unordered list:

 * first
 * second
 * third
 * fourth

Code spans

Code spans are delimited by backticks.

```
system.out.println("markdown is cool");
// random code
```

Quoteblocks

> Email-style angle brackets are used for quote blocks.
>> You can also nest them.
>> You can also *nest* and **format** inside a quote block
> To break the nested blockquote, add a space between lines.
>Markdown allows you to be lazy and only put the > before the first line of a hard-wrapped paragraph

Add another line to resume regular paragraph text.