Available chart types

Bar

bar chart

Stacked bar

bar chart

Column

bar chart

Stacked column - numbers

bar chart

Stacked column - percentage

bar chart

Line

line chart

Line with plot bands

line chart

Donut

donut chart

Pie

donut chart

Available color combinations

Option 0

color combination

Applicable to:

  • line - always
  • other chart types only if number of elements is more than 6

Option 1

color combination

Applicable to:

  • bar
  • column
  • donut
  • pie
  • if number of elements equals/is less than 6

Excluded:

  • line

Option 2

color combination

Applicable to:

  • bar
  • column
  • donut
  • pie
  • if number of elements equals/is less than 6

Excluded:

  • line

Option 3

color combination

Applicable to:

  • bar
  • column
  • donut
  • pie
  • if number of elements equals/is less than 6

Excluded:

  • line

Option 4

color combination

Applicable to:

  • bar
  • column
  • donut
  • pie
  • maximum number of elements equals/is less than 4

Excluded:

  • line

Option 5

color combination

Applicable to:

  • bar
  • column
  • donut
  • pie
  • maximum number of elements equals/is less than 5

Excluded:

  • line

How it works

  • It allows us to convert the data into graphical chart representation format which is interactive and user friendly
  • Available chart types
    • Bar
    • Stacked bar
    • Column
    • Stacked column - numbers
    • Stacked column - percentage
    • Donut
    • Line
    • Line with plot bands
    • Pie   
  • Six color combinations are available
  • For each chart two CSV-files* are needed
    • data
    • text
  • Advantages in comparison to the Highchart component
    • allow more users to create a chart
    • shorten the time required for a chart creation
    • simplify the way how charts are delivered
    • allow easier and faster maintenance
    • allow smoother extension of templates
    • allow global control over charts
  • Accessibilty description of the chart is mandatory

Reference for advanced web specialists

The component consists of following tabs: Interactive Chart, Channels, References, Adobe Target and it’s based on:

  • Content Fragment (new template called Interactive Chart Fragment) which defines a type of the chart e.g. pie, bar chart etc.
  • Data and Text/ Label csv files which populate the chart with the data and the translations (the files should be stored under /dam/fit/interactive-chart-data).

While all publishers can create a component simply choosing the proper chart type from the Interactive Chart Content Fragment dropdown (and populating it with csv files), the creation of the chart types is managed only by the user with the Business Platform Manager role.

screenshot - aem view

Chart description for accessibility is mandatory

screenshot - aem view

CSV files

CSV files must be uploaded to a respective folder in AEM