Chart Widgets: Column Chart

You'll need this:

Check this video for a step-by-step Column chart configuration:

On this help guide page:

1. Add a column chart
2. Setup the widget
3. Additional settings
4. Additional buttons

1. Add a column chart

To add a column chart to the page, all you have to do is click on it and drag and drop it on the page. 

Once you add the widget a pop-up window will open where you can add your content.

2. Setup the widget

The key building blocks of this graph are Dimension Groups, Dimension Labels, and Metrics. Let's set it up together!

Start by clicking Add Group to create your columns. Give each group a label and continue to add groups until you have the number that you need. You can include as many groups as you want!

In the example below we added four groups as such our widget will have four columns.

Now it's time to Add Dimension. Fill in Dimension Label, for example, 'Own Score'. This will be shown in the legend underneath the graph. 

Moving on to Add Metric. Note that the number of metrics must correspond to the number of groups so that you'll have a numeric value for each column.

For example, in a column chart of four categories, there are four groups (columns), so for each dimension there are four metrics. See the example below:

You can also add extra dimensions, for example, if you want to compare respondent's score vs average. Below we add a second dimension 'Other managers in the organisation' with static numbers as metrics:

After saving this is how our column chart will look like:

Now you've set up your graph, you can also configure the last settings.

1. Chart title - give it a meaningful name

2. Y-Axis scale interval - choose the interval spacing for gridlines marking the vertical axis. Make sure you have a few to make the graph easy to read.

3. Y-Axis max - until which value do you want your y-axis to display? Enter it here.

3. Additional settings

Select the widget and then at the right of the screen click on the Settings button. The widget list will be replaced by the additional settings.

Here you can find the following settings:

1. ID
2. Name
3. Rules
4. Margins
5. Background color
6. Chart settings 

1. ID

This is the ID of the widget.

2. Name

You can name your widget in order to identify it easier.

3. Rules

You can add your widget logic rules to ensure that your content will be visible only when the conditions are true. 

4. Margins

Add margins to create space around elements and move them in your page. By default the margins are set to 0, but you can change that anytime and add the margin you prefer.

5. Background colour

You can change the background colour of this specific widget by clicking the color selector.

6. Chart settings

You can change the default title and label font size if you want. This is very useful if you are placing your chart inside a column, or you adjust its size. In this case you will have a smaller chart but your text will still be readable.

4. Additional buttons

When you click on your widget four blue buttons appear to the right.

The Arrow allows you to move between the different layers of the page. For example if you add a widget in a column then you have 3 layers: the page, the column and the widget. The arrow allows you to quickly select a different layer.

The second icon, the four arrow sign, allows you to move your widget up or down to the page.

The third icon, the page, allows you to copy this widget and the forth icon, the bin, to delete it.

What's next?

• Renewed Report Builder-Bar chart: Add a Bar Chart widget to your customized report to show respondents' results or another data set at a glance. This way you will display your data with rectangular bars. It allows you to show data separated into categories with relative numbers.
• Renewed Report Builder-Gauge chart: Add a gauge chart to your personalized PDF report to represent average or actual scores or percentage results for question blocks or formulas. Respondents can see at a glance if they've scored towards the top-end or bottom-end of the scale. It  allows you to display a large data set visually.
• Report Builder-Spider chart: A spider chart is a great graphic way to compare results from different questions and visualize performance, for example between school subjects or departments of a business. You can include as many axes as you want, but the most visually appealing and clear would be between three and six axes.

Don't want to build it yourself? Contact our professional services team