Toucan 3.0
YouPrep documentationHelp centerGet a demo
  • Welcome
    • 👋Welcome to Toucan
    • ⚙️Technical resources
      • ⚙️Toucan stack
      • Setup mode
        • Toucan SaaS mode
      • ⚙️Security
        • Application Security
        • Source Code Quality
        • Global Security Practices
        • Security of Docker Images
  • TUTORIALS
    • 📊Getting Started : Embedded Analytics
    • 🤓Advanced tutorials
      • Embedding a story with user attributes
        • Dynamic filter with user attributes
        • Dynamic Tables
        • Dynamic Database
        • Dynamic Host
      • Using the HTTP API connector in advanced use cases
      • Using advanced syntax for SQL queries
      • Merging filters with our tool
      • Deep customization chart (CSS)
        • Homepage customization
        • Chart customization
        • Dashboard customization
  • Data Management
    • 🧮Overview of Data In Toucan
    • 📡Datasources in Toucan
      • 🔌Managing Connectors
        • 🔌Creating, editing and deleting a connector
        • 🔌Set up OAuth2 credentials for your platform
        • 🔌Setting up a connector
          • 🔌Generic Connectors
            • 🔌Setting up an HTTP API connector
            • 🔌Setting up an ODBC Connector
          • 🔌Database and data warehouse Connectors
            • 🔌Setting up an AWS Redshift Connector
            • 🔌Setting up a Snowflake Connector
            • 🔌Setting up a PostgreSQL Connector
            • 🔌Setting up a Google Big Query Connector
            • 🔌Setting up an AWS Athena connector
            • 🔌Setting up a MySQL connector
            • 🔌Setting up a MongoDB connector
            • 🔌Setting up a Microsoft SQL Server connector
            • 🔌Setting up an Azure SQL connector
            • 🔌Setting a Databricks Connector
            • 🔌Setting up a ElasticSearch Connector
            • 🔌Setting up a Clickhouse Connector
          • 🔌Online services connectors
            • 🔌Setting up a Sharepoint Connector
            • 🔌Setting up a Google Sheets Connector
            • 🔌Setting up a Salesforce Connector
            • 🔌Setting up a Hubspot Connector
          • 🔌Setting up an AWS S3 connector
      • 🗄️Managing remote file storages
        • 🗂️Setting up a file storage
          • SFTP
        • 📄Create a dataset from a file
      • 📁Managing Files
        • 📁Adding, editing and deleting local files
        • 📂Using advanced file settings
        • 📁Adding and combining remote files in Toucan
    • 🔢Datasets in Toucan
      • 🔢Stored and Live Datasets
      • 💿Managing datasets
        • 🔢Creating datasets
        • 🔢Editing, Duplicating and Deleting a dataset
        • 🔢Refreshing and Publishing Datasets
        • 📈Optimize data performance
        • 🗂️Adding indexes to stored datasets
        • 👩‍💻Code mode and single mode
      • 🛑Setting permissions on dataset
      • 🗃️Maintaining Data
        • 🗃️Tagging datasets
        • 🗃️Identifying datasets dependencies
        • 🗃️Set validation rules
    • 🧑‍🍳Preparing data
      • Overview of YouPrep™
        • 🎹Column header
          • Rename column
          • Duplicate column
          • Fill null values
          • Replace values
          • Sort values
          • Convert columns data types
        • Add
          • Add text column
          • Add formula column
          • Add conditional column
        • Filter
          • Delete columns
          • Keep columns
          • Filter rows
          • Top N rows
          • ArgMax
          • ArgMin
        • Aggregate
          • Group by
          • Add total rows
          • Hierarchical rollup
          • Get unique groups/values
        • Compute
          • Compute evolution
          • Cumulated sum
          • Percentage of total
          • Rank
          • Moving average
          • Compute statistics
          • Absolute value
        • Text
          • Concatenate
          • Split column
          • Extract substring
          • To lowercase
          • To uppercase
          • Compare text columns
          • Trim spaces
          • Replace text
        • Date
          • Convert text to date
          • Convert date to text
          • Extract date information
          • Add missing dates
          • Compute duration
          • Normalize date granularity
        • Reshape
          • Pivot
          • Unpivot
          • Waterfall
        • Combine
          • Append datasets
          • Join datasets
        • Geo
          • Geographic dissolve
          • Geographic hierarchy
          • Geographic simplify
          • Prepare geo data (with basemap)
      • YouPrep™ Native SQL
      • Hybrid pipeline
    • ➿Managing variables in Toucan
      • ➿Variables hub
      • ♈Use variables in YouPrep™
      • ➿Easy reference to variables
    • 🧞Using advanced data concepts
      • 🧞Data personnalisation with user attributes
        • Connector setup with a user attribute
        • Database selection with a user attribute
        • YouPrep data filtering with a user attribute
        • Filter data in SQL with a user attribute
      • 🧞Advanced syntax for variables
      • 🧞Data cache
  • Visualizations and Layouts
    • 📺Apps
      • 📺Managing Apps
        • ➕Creating Apps
        • 📄Duplicating Apps
        • 🖨️Publishing Apps
        • 🚮Deleting Apps
        • ✍️Editing within an App
      • 🖌️Customizing Apps
        • Customizing chart color elements
        • Customizing the app's font
        • Adding Assets
        • Adding Glossary
        • Setting up, Managing and testing custom visibilities
        • Customizing the "no data error" message
        • Creating a dynamic background based on an Filter's column
      • 🏠Home
        • Creating the Home
        • Creating Tiles
          • Tile Dynamic Value
          • Tile Leaderboard
          • Tile Line
          • Tile Scorecard
          • Tile Bullet
          • Tile Heatmap
          • Tile PDF
          • Tile Video
          • Tile Image
          • Tile Text
          • Tile HTML
          • Tile Separator
      • ✨Stories
        • Creating a Story
        • KPIs
        • Narrative
        • Crossfilter
      • 📽️Filters
        • Managing Filters
          • Creating, reusing and editing Filters
          • Applying Filters
          • Unpinning and deleting Filters
        • Type of Filters
          • Dropdown
          • Checkboxes
          • Buttons
          • Date Range
          • Hierarchical
          • Slider
        • Templating from Filters' values
        • Dependant Filters
      • 📈PDF Report
      • 🎡Datawall
      • 🏗️Dashboard Builder
        • Create a Dashboard Builder
        • Embed a Dashboard Builder
        • Dashboard export options
      • 🌟MyFavorites
    • 📊Creating Visualizations
      • 🤩Viz Gallery
        • Barchart
        • Barlinechart
        • Bubblechart
        • Bulletchart
        • Circularchart
        • Funnelchart
        • Gantt chart
        • Heatmap
        • HTML
        • Leaderboard
        • Leaderboard Centered Average
        • Linechart
        • Mapchart
          • Configure a drill
        • Mediachart
        • Radarchart
        • Tablechart
        • Timeline
        • Versuschart
        • Waterfallchart
        • Score Card
        • Stacked Barchart
      • 🧠Common Chart Configuration
      • 💅Customizing chart colors
      • 🧞‍♂️Advanced chart configuration
        • Templating from chart's dataset
        • Add units, precisions and sentiments
        • Adding Tutorials
        • Add sparklines
        • Navigate with stories
        • Group informations in your stories
        • Multiple charts in one story
        • Manage dates
        • Customize tiles' sources
        • Add stars to tiles' title
        • Manage data order in your tiles
        • Navigate with tiles
    • 👩‍💻Embedding
      • 🔐Authentication
      • 🖇️Integration
        • Generate and manage embeds
        • Customize embeds
        • Embedding a Toucan App Using iFrames
        • Passing Extra Variables to Your Toucan Embed
      • ⚙️Embed SDK
        • Embed SDK Authentication
      • ❓FAQ
    • 🙋Self-Service
      • Self-Service Dashboard
        • The embedded Self-Service Dashboard
        • The in-platform Self-Service Dashboard
      • Self-service PDF Report
  • Collaboration
    • ⏰Creating alerts
    • 📧Managing notifications
    • ➕Enriching a story with descriptions
    • 💌Sharing content
    • 💬Adding comments to stories
  • Administration
    • ⚙️Instance Management
      • ⚙️Managing operations in SaaS
      • ⚙️Customizing your instance (whitelabel)
    • 👥Managing Users
      • 👥Users
      • 👥Managing user groups
      • 👥Managing user properties
      • 👥Setting up permissions and visibilities
    • 🌐Managing languages in Toucan (internationalisation)
    • 📈Monitoring Engagement with User Analytics
      • 🎛️How to Filter your User Analytics?
      • 🖥️Understanding your User Analytics Dashboards
  • Additional Ressources
    • 📚External documentation
    • 🚁Support for App-builders
    • 🆕Latest releases
      • 🎁2025 Releases
      • 🎁2024 Releases
      • 🎁2023 Releases
    • 🔧Troubleshooting
      • Troubleshoot:: DataHub
      • Cross-Site Cookies
      • How to :: read the inspector error
      • How to :: troubleshoot the toucan way
Powered by GitBook
On this page
  • 🧭 Overview
  • ⭐ Key Features
  • Configuration

Was this helpful?

  1. Visualizations and Layouts
  2. Creating Visualizations
  3. Viz Gallery

Stacked Barchart

Last updated 14 days ago

Was this helpful?

🧭 Overview

Stacked bar charts are used to show how different components contribute to a total across categories. They help illustrate part-to-whole relationships while preserving the ability to compare overall category values.

📊 Example Use Case

  • Customer feedback volume broken down by sentiment

  • Feature requests grouped by user type or plan tier

  • Monthly signups segmented by acquisition channel

⭐ Key Features

What Makes This Chart a Standout?

  • Automated Calculations: This chart automatically calculates the total for each label—no manual work needed.

  • Flexible Display Options: Viewing time-based data? Try switching the chart to a vertical layout 🗓️.

  • Horizontal or Vertical? Your Choice! While we used to display this chart horizontally, don’t forget you can easily switch to a vertical view!

Configuration

Learn how to create a stacked barchart using the new design with this step-by-step guide. Explore the interactive walkthrough below to get started quickly, then dive into the full configuration reference table for in-depth details.

Chart Configuration Step-by-Step

Option
How does it work?

Bar orientation

Vertical/Horizontal

The chart can be displayed either horizontally or vertically.

Dimension

Bar category

The bar category corresponds to a column in your dataset, such as 'Product Type'.

Order bars

This option allows to order bars either by column or by custom value.

By column

Bars are ordered based on the selected column. By default, they follow an ascending order—starting with numerical categories, followed by alphabetical (A-Z). This order can be reversed.

By custom value

Bars are ordered based on the selected measure. For example, if the category is 'October' and the bar height is '10', you need to set the value to 10 for this bar to appear first.

Change date format

You can change the display format by selecting an option from the dropdown. Common D3 formats are suggested. Note: Your column must be in a date format for this option to work.

Measure

Bar segment

The bar segment represents a subcategory within each bar, corresponding to a column in your dataset—for example, 'Region' or 'Status'. Each segment stacks within the main bar to show how the total value is divided among its parts.

Bar height

The bar height represents a value from your dataset. You can select an aggregation method from the menu, which may vary depending on the chart type.

Precision

Precision determines the level of detail in how your values are displayed. By default, measures use a .2f format, meaning they are shown with two decimal places.

Example: A value of 3.14159 will be displayed as 3.14 when using .2f formatting.

Unit

Unit represents the total quantity or category being measured for a KPI. It defines what the values correspond to, providing context for better interpretation.

Order segment

The order segment defines the sequence in which the stacked segments appear within each bar. It corresponds to a column in your dataset, such as 'Priority' or 'Stage', and affects the visual arrangement from bottom to top.

Reverse segment order

The reverse segment inverts the stacking order of the segments within each bar. This can help emphasize certain values by bringing them to the top or bottom, depending on the chosen display order.

Show value on segment

Displays all values above the line for easy visibility.

Reverse height order

Reverse height order flips the position of the bars based on their total value—placing the largest at the bottom (or left, in horizontal layout) and the smallest at the top (or right). This can help highlight lower values or change the visual emphasis of the chart.

Additional parameters

ID

Unique chart Id

Add complementary value

The complementary value is displayed in the data label, providing additional context and making it easier for viewers to interpret the data at a glance. It is possible to add a precision, an unit and a sentiment.

Add user chart guide

Lead your chart viewers through the narrative of your data.

Chart performance

Technical performance

*Mandatory parameters

Section
Option
Configuration tutorial

Dataset*

Select the dataset used by the chart

Label*

This will define the name of each of the bars you want to display.

Select the column containing bar label

Groups*

Your groups of choice

Value*

Select the column containing the value

Legend

Display Legend

Toggle to activate legend display

Legend

Default selected bar

Choose the first, last or the name of the label

Legend

Additional info

Add another column for more information on the legend

Sort

Sort bars

Use it to order bars

Sort

Labels order

Use it to order labels

Sort

Groups order

Use it to order groups

Groups

Groups additional info

Add another column for more information on the group

Packs (Horizontal Display Only)

Packs

Group labels together based on a column

Packs (Horizontal Display Only)

Packs order

Order pack based on a column, on an advanced order or a custom order

Packs (Horizontal Display Only)

Display packs names

Toggle to display packs names

Lines (vertical display only)

X axis

Use to choose X axis same as bar labels

Lines (vertical display only)

Y axis

Use to choose Y axis

Lines (vertical display only)

Smooth line

Toggle to interpolate between poinfs

Lines (vertical display only)

Show all values on line

Toggle to show all values on line

Lines (vertical display only)

Use same scale for bars and lines

Toggle to use same scale for bars and lines

Enrich chart

variation

Add a variation in your data with your evolution values

Enrich chart

URL link

Add url link to bars label

Display

Custom Date format (for date labels)

This option lets you display your dates just the way you want. Insert d3 time format (.i.e. ‘%Y’ to display just years.)

Display

Hide bar total

Toggle to hide bar total

Display

Hide empty groups

Toggle to hide empty groups

Display

Display all values

Toggle to display all values included negative values

Display

Recycle groups colors

Reuse groups colors when chart data changes (filters changes for example)

Display

Highlight selected bar

Toggle to display rectangle around selected bar

Display

Choose display direction

Choose a vertical or horizontal display direction

Display

Size

Define the chart size when having multiple ones

Display

Mobile size

Define the chart size when having multiple ones on mobile

Display

Custom CSS class

Set a custom CSS class to target this specific chart with CSS

Tutorial

Enter an ID

Enter an ID.

Change the ID to display the tutorial again.

All tutorials with the same ID will be displayed only once

Tutorial

Enter a message

Enter your message | This will be displayed to your users

Tutorial

Always show this tutorial

By default the tutorial is shown once only

📊
🤩