# CSV Connection

{% hint style="info" %}
Check out the given walk-through on how to create the CSV data connection and associated it with a charting component. 
{% endhint %}

<figure><img src="https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2FpDb4aPd0wkWb3GboGLOW%2FCSVConnection.gif?alt=media&#x26;token=13086298-867f-40e8-92f6-221ee845dbd3" alt=""><figcaption></figcaption></figure>

Click the ***Data source*** icon provided on the right side of the canvas, and view the database connectivity options.

* Click the ***Data Connectors*** icon  to display all the available data connector types.
* Click the ***Create New Connection*** icon  provided next to the ***CSV*** option.
* A new connection gets added under the CSV connection type.
* Click the connection to display the connection-specific details.

![Creating a New Connection](https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2Ft47KOXWHwg7KHal1JMoj%2Fimage.png?alt=media\&token=56fd8633-fc34-4ed3-8bf4-55d560420b2c)

* Configure the following information:
  * **Name:** Name the connection.
  * **Browse:** Click the ***Browse*** icon  to browse a CSV file.
  * **Load at Start:** Enable this option to get the updated data from the data source before loading it into charts.
* The ***Field Set*** tab displays all the fields after establishing the data connection.   &#x20;

![Configuring a Data connection](https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2FmbZ0N8wrCNPGYIMMTzrP%2Fimage.png?alt=media\&token=f3535f39-be77-4fa5-a430-215197cc0086)

### Condition

* Select the ***Condition*** tab.
* Provide a condition to be applied as a filter on the selected data by putting a checkmark in the given box.&#x20;
  * **E.g.,**  As displayed in the following image, specific date has been provided under the Conditions column for the Timeline so, data for the given date will be taken.   &#x20;

![](https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2FfPLFh7FZfolk1Ott4LzP%2Fimage.png?alt=media\&token=07e655fc-d124-4ced-9e8e-798ef4219ed0)

### Calculated Field

The users can add a calculated field by using this tab.

* Navigate to the Data Connectors page.
* Create a connection by selecting a specific Data Connector type.
* Connect to the desired data source to access the available fields.
* Click the ***Calculated Fields*** tab.
* The ***Calculated Field Editor*** dialog box opens.
  * **Name:** Provide a name for the calculated field
  * **Script Editor**: Use the Script Editor space to insert the desired calculation formula using the rule given below.
* Click the ***Create*** option to create the calculated field.

&#x20;    ![](https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2Fgs9ZS03FS22e7hhae9ZS%2Fimage.png?alt=media\&token=e453eabe-d35b-482d-82f7-952d934a57b5)

{% hint style="info" %} <mark style="color:green;">Please Note:</mark>&#x20;

* Enclose field names in square brackets: \[total\_sales]/\[number\_of\_items]

* Enclose global variable in curly braces: {bar1.profit}\*2+\[profit\_jan]
  {% endhint %}

* The newly created calculated field gets added under the ***Calculated Fields*** tab.

&#x20;  &#x20;

![](https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2Ff5Id8Mn9dG8GbfrwtMTb%2Fimage.png?alt=media\&token=0d419a2a-c525-448b-b51a-f08e52e33e7a)

### Script on Load for a Data Connection

The users can apply their modifications or preferences at the connection level using the Scripting window to get the modified data.             &#x20;

* Navigate to the Data Connectors page.
* Select a Data Connector type.
* Create a new Connection and configure it.
* Select the ***Script on Load***  icon provided next to the connection.  &#x20;

![Accessing the Script on Load icon under the Data Connectors page](https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2FwAFJc29BZ1X52FwchiX3%2Fimage.png?alt=media\&token=26ff21f0-41fe-4bc3-a184-88a98392bca2)

* The ***Script*** tab appears to trigger a script to produce some action on the data connection.

![The Script tab for connection](https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2FuFso9cws1KPJVbiRaxog%2Fimage.png?alt=media\&token=9e2862af-d51e-4b63-be97-00261edc7a20)

* The user can also use a script for the Dashboard, which can be accessed via the **Components** tab.

![The Script window for the Dashboard components](https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2FA4Z8cdCZIn9G5DnIVYZR%2Fimage.png?alt=media\&token=48be3a6b-8991-4daf-b36b-b94a5d418321)

* The user can search the script for the Dashboard, which can be accessed via the ***Script*** tab.

![The Script window for the Dashboard ](https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2FotIthxDqmO22smFY7jXn%2Fimage.png?alt=media\&token=b1022328-5add-46bd-9252-ff8919b08160)

<mark style="color:green;">Please</mark> <mark style="color:green;">Note:</mark>

* Click the ***Help*** icon from the Script on the Load page.   &#x20;

![Accessing the Help icon ](https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2FCSPaxUguFfkA62BnTNIQ%2Fimage.png?alt=media\&token=8bc56bc0-ca7e-411d-8798-48c9f318d880)

* The ***Scripting Help*** tab opens with some predefined scripts.                              &#x20;

![Scripting Help tab with pre-defined scripts](https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2F1qBbm9MMtHfVZ9zqbIH7%2Fimage.png?alt=media\&token=d3c19780-d0ff-4e4a-b044-89e269f22578)

* Click the ***Advanced Scripting*** option to display the chart-wise advanced scripts.    &#x20;

![The Advanced Scripting tab displaying the chart-wise advanced scripts](https://972575688-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRYq1HgffNfbnIMWPu1D5%2Fuploads%2FPmsTSn1CTmki6imHo6QG%2Fimage.png?alt=media\&token=a7baa0d6-09a9-4c2a-9382-63150d619871)

&#x20;              &#x20;