# Line chart

The Line Chart Portlet allows data to be presented as a line chart. It is possible to add multiple series and set colors of choice.

## General

General data is required for all portlets.

[General configuration](https://help.novacuraflow.com/6.11/development/flow-portal-2/common-configuration#general)

## Listeners

The portlet can listen to the following commands:

* On Row Selection
* On Filter
* On Refresh

[Listeners configuration](https://help.novacuraflow.com/6.11/development/flow-portal-2/common-configuration#listeners)

## Data

### Data source

Data source configuration enables the portlet to execute specified queries towards the chosen database connector to fetch data, or fetch data from a workflow.

* Database: uses a flow connector to retrieve data from a database
* Workflow: runs a workflow to retrieve data

[Data source configuration](https://help.novacuraflow.com/6.11/development/flow-portal-2/common-configuration#database-source)

[Workflow source configuration](https://help.novacuraflow.com/6.11/development/flow-portal-2/common-configuration#workflow-source)

### Presentation

* Category column: use the drop down to select the category the chart should show. This will be displayed on the x-axis.

#### Category column 

Use the drop down to select the category the chart should show. This category will be displayed on the x-axis.

#### Data Series

Click *New* to configure the data series.

* Name: the name of the series, will be shown in the legend
* Field column: the data set which is to be shown

{% tabs %}
{% tab title="Category column" %}

<div align="left"><img src="https://543770944-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LtPTgZOYmpJka4jqs1v%2F-M0le5j_gl9DF2QmJZUb%2F-M0lemVotZaZhkyNy90A%2Fimage.png?alt=media&#x26;token=4533b2c8-c733-439f-8d48-45acfe725afd" alt=""></div>
{% endtab %}

{% tab title="Data Series" %}

<div align="left"><img src="https://543770944-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LtPTgZOYmpJka4jqs1v%2F-M0le5j_gl9DF2QmJZUb%2F-M0lesFs7s_y9NiSdcn5%2Fimage.png?alt=media&#x26;token=de026e54-0c1e-4448-a7e8-6be74af8bafe" alt=""></div>
{% endtab %}
{% endtabs %}

<div align="left"><img src="https://543770944-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LtPTgZOYmpJka4jqs1v%2F-M0lmUtIWlLmABDYBGQO%2F-M0lmkPSCVY0rbW4e4-p%2Fimage.png?alt=media&#x26;token=504f7e58-0c1e-4273-bf04-1b3608ecec88" alt=""></div>

## Style

Change the header text color and add a header stripe by configuring style.

[Style configuration](https://help.novacuraflow.com/6.11/development/flow-portal-2/common-configuration#style)