Using CSV Data
- Overview
- Adding Data Sets in CSV format
- Mapping data from CSV Data Sets
- Using multiple data sets
- Custom attributes mapping
- Using actions with CSV Data
- Using one Data Set in different dashboard views
Overview
By default AnyChart get data in proprietary XML format. This format gives the vary flexible way of controlling any settings of every point on the chart. At the same time XML can create pretty large, when data set includes thousands of points.
If you have no need to configure each point individually you can use CSV data input to make data file smaller and decrease loading time.
Using CSV allows to make data file smaller for each point description contains only data and fields separators and nothing more.
Adding Data Sets in CSV format
The idea of working with CSV data is in adding the data sets themselves and mapping these data sets to regular AnyChart data series.
AnyChart can use several CSV data blocks, we call them data sets. These data sets are defined in <data_sets>, subnode of <anychart> node. The data set is described in <csv_data_set name="dataSetID"> node, name attribute is the unique identifier used to map series to the set. The data itself is contained in <csv_data_set> node.
Below you can see how one should define a single CSV data set in XML:
As you can see the data is contained in <csv_data_set> node. CSV often contains column names in the fist row - AnyChart doesn't accept this - <csv_data_set> can contain only data rows.
AnyChart use double quotes " (ASCII code 34) to enclose the strings that contain separator symbols, if you need to use double quote in the field value you should escape it with reverse slash. For example "\"a,b,c\"" allows you to get "a,b,c" string as the value.
By default AnyChart treats "," as the columns separator, and new line "\n" a as rows separator, if you'd like to use another separators - you need to define the explicitly using rows_separator and columns_separator attributes in <csv_data_set> node. XML Sample below shows CSV data with semicolon ";" used as the columns separator, and Carriage Return with Line Feed "\r\n" used to separate rows:
Mapping data from CSV Data Sets
After adding CSV data you need to map them to chart data series. For each series in the chart - mapping is configured individually. This mapping defines what column in CSV data set are used as the values for series.
XML below shows the mapping for the two different series:
As you can see when CSV data is used data_source attribute should be set to "CSV" - if you don't set mapping info is ignored and series is treated as regular XML.
All mapping data is set in <csv_data_mapping> nod. So series can use any defined data set, you should set its name in data_set attribute: <csv_data_mapping data_set="simpleDataSet"> in XML sample above.
After the data source is defined you should map fields for the series. Mapping is set via listing <field> nodes in <csv_data_mapping> node. Syntax is the following: <field column="0" name="y"/>, where column - is the index of the column in CSV table (indexing start from zero), and name - is the name of XML attribute that will use this column data as the source.
Please take a look at the live sample of using one data set in CSV format and three data series, that get the same data for names (name="name")and different column for values ( name="y"):

For the different plot types and different series types - different columns should be used. For example to map scatter with bubbles the syntax looks like:
Please refer to the table below that lists specific fields names for different plot types and series, with the fields keywords to be used for mapping:
CategorizedVertical
CategorizedHorizontal
CategorizedVerticalBySeries
CategorizedHorizontalBySeries
Series Type | Field Keywords |
---|---|
Bar | name, y |
Line | name, y |
Spline | name, y |
StepLineForward | name, y |
StepLineBackward | name, y |
Area | name, y |
SplineArea | name, y |
StepLineForwardArea | name, y |
StepLineBackwardArea | name, y |
Marker | name, y |
Bubble | name, y, size |
RangeBar | name, start, end |
RangeArea | name, start, end |
RangeSplineArea | name, start, end |
OHLC | name, high, low, open, close |
Candlestick | name, high, low, open, close |
Map
Series Type | Field Keywords |
---|---|
MapRegion | name, y |
Marker | name(optional), x, y, link(optional) |
Bubble | name(optional), x, y, size, link(optional) |
Line | name(optional), x, y, size, link(optional) |
Area | x, y |
Connector | x, y |
Scatter
Series Type | Field Keywords |
---|---|
Bar | x, y, name(optional) |
Line | x, y, name(optional) |
Spline | x, y, name(optional) |
StepLineForward | x, y, name(optional) |
StepLineBackward | x, y, name(optional) |
Area | x, y, name(optional) |
SplineArea | x, y, name(optional) |
StepLineForwardArea | x, y, name(optional) |
StepLineBackwardArea | x, y, name(optional) |
Marker | x, y, name(optional) |
Bubble | x, y, size, name(optional) |
RangeBar | x, start, end, name(optional) |
RangeArea | x, start, end, name(optional) |
RangeSplineArea | x, start, end, name(optional) |
OHLC | x, high, low, open, close, name(optional) |
Candlestick | x, high, low, open, close, name(optional) |
Using multiple data sets
Sometimes different series within one plot can have unsynchronized data and you can't use the same CSV data table. You can solve this problems using multiple data sets.
As it is said above - when you map series you define a certain data set. So the task is to define the data sets and map them in a right way.
Live sample below two data CSV sets with different data, and two series that use own set:

Custom attributes mapping
Besides the data fields required to create chart of given series you can add custom data attributes from CSV table, which can be used in labels, tooltips and actions.
Syntax to define custom attribute:
As XML shows columns number 0 and 4 are used to set data, and all other columns are used as custom attributes. The name of the custom attribute is set in name attribute - names should be unique and doesn't be the same with value fields names. To define that field is a custom attribute is_custom_attribute attribute should be set to True.
Live sample below shows custom attributes defined in CSV data set used in tooltips:

Using actions with CSV Data
AnyChart has the very flexible system of actions that can be attached to the series or point. When you use CSV data set as a source for series you can't define action for the given point, but you still can define actions for the series parameterized for each point. Actions can accept custom attributes or values.
XML below shows how action should be attached to the series with CSV data, custom attribute url is contained in CSV data set:
You can use custom attributes in all other actions, please take a look at the sample:

Using one Data Set in different dashboard views
The fact that data sets are not bound to any specific chart you can use them in diffent chart when arranging a dashboard.
Live sample below shows how a single data set is used to create different charts in the dashboard. Both charts use the same column to define the names, but the values are different:
