Skip to main content

Chart

The Chart Component in Akuko empowers you to create dynamic and interactive charts to visualize your data in meaningful ways within your data stories. Whether you need to illustrate trends, compare data points, or provide data-driven insights, the Chart Component provides a wide range of chart types and customization options to help you convey your message effectively.

Key Features​

Chart types​

The Chart Component offers a wide variety of chart types to choose from, including line charts, bar charts, pie charts, scatter plots, and more. This diversity allows you to pick the most suitable chart type for your data presentation needs.

Customization​

The Chart Component provides extensive customization options. You can customize chart colors, labels, legends, and axes to match your data story's design and branding. Additionally, you can add tooltips and data labels to enhance data exploration.

Interactivity​

Make your charts interactive by enabling features like hover effects and click events. Users can explore data points, view additional information, or trigger actions based on the chart interactions.

Properties​

The Chart Component offers several properties to configure its appearance and behavior:

name​

string The component name

chartType​

string The type of chart (bar, column, scatter, etc.)

source​

uuid The uuid of the Source

backgroundColor​

string The background color of the Chart

barLabelColor​

string

barLabelRotate​

number

barLabelTextAlign​

string

barLabelTextBaseline​

string

caption​

string Caption for the Chart

categoryTickCount​

number

disableAutoGeneratedColors​

boolean

disableFillNullValues​

boolean

gridLines​

boolean Show or hide grid lines

height​

number The height of the Chart in pixels

hideLabels​

boolean Hide or show labels

labelFill​

string Label fill color

labelOffset​

number Offset for label

labelPositionOutsideBar​

boolean Labels inside or outside bar

legend​

boolean Show or hide Chart legend

limit​

number Number of data rows to show in Chart

maxColumnWidth​

number Max width of column in pixels

opacity​

number The opacity of the Chart

paddingTop​

number Padding on top of Chart

paddingRight​

number Padding on right of Chart

paddingBottom​

number Padding on bottom of Chart

paddingLeft​

number Padding on left of Chart

series​

array Array of Series for Chart

seriesTickCount​

number The number of ticks to show in series

showBarLabels​

boolean Show or hide labels on bar

showPercentageChart​

boolean Enable percentage chart

filters​

array Array of filters

Examples​

Explore examples of the Chart Component in action: