Renewed Report Builder: Bubble chart

The bubble chart widget allows your respondents to see their results from different questions but also compare them to other components. A bubble chart stands out because it allows a comparison between three variables.


This guide will teach you:

  1. Add a bubble chart to the page
  2. Setup the chart
  3. Additional settings
  4. Additional buttons

1. Add a Bubble chart to the page

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

Bubble chart- add a Bubble chart to the page

2. Setup the chart

Bubble chart- chart items

Start by setting up your Dimensions, to create the bubbles that will be displayed on your graph. Click Add Dimension to add the first one.

Bubble chart- Bubble chart settings

  1. Dimension Label - give a different name to each dimension to ensure you are looking at the correct data.
  2. Dimension color - choose a color by clicking on color selector. Take care to choose distinctly different colors for each point, so it will be easy to tell the difference between them!
  3. x-Axis position - you can choose variables from the Add variables dropdown to set the x-Axis of each point or you can add numerical values.

  4. y-Axis position - you can choose variables from the Add variables dropdown to set the y-Axis values of each point or you can add numerical values.

  5. Bubble size - add a value to measure the size of your bubbles on the graph

  6. Metric name - name the bubble that will be shown on your graph

  7. Add Metric - click here to add another bubble to be shown on the graph.

  8. Add Dimension - add another dimension

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

Bubble chart- Bubble chart settings

  1. Chart title - This title will be displayed above your chart
  2. Show Legend - Toggle the Show Legend button if you want to display the different score names associated with your data matrix
  3. Show grid - Toggle the button to get rid of or add the grid
  4. Y/X-Axis title - This is the label that will be shown immediately under the y/x-axis.

When you are done click Save and close to save your work and view your chart.

3. Additional settings

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

Bubble chart- 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.

Bubble chart- id

2. Name

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

Bubble chart- name

3. Rules

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

Bubble chart- rules

When you click the Edit rule button a new pop-up window will appear.

Bubble chart- add logic rules

Select from the dropdown menu the option you want, and then fill in all the required fields. Once you add everything you can click the Submit button.

Bubble chart- submit button

Your content will not be displayed on the page anymore, instead of the content you will be able to see the widget logic rules.

Bubble chart- rules

If you would like to edit your content again just click on the rule and the widget will expand. To edit the rule you would have to click on the Edit rule at the settings.

Bubble chart- edit rule

This is the window where you can delete the rule by clicking on the Delete rule button.

Bubble chart- delete rule

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.

Bubble chart- margins


You can add margins left and right to make your chart smaller. The bigger the margins, the smaller the chart. Note that the margins should be equal, in order for the chart to be centered in the page. 

5. Background color

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

Bubble chart- background color

Once you click it the background color selector will expand and you will be able to select the color you want or add the color hex.

Bubble chart- background color

To save just click Apply color.

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.

Spider chart- chart settings

4. Additional buttons

When you click on your widget, 4 blue buttons appear.

Bubble chart- additional buttons

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.

Bubble chart- additional buttons

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-Table: The  Table widget allows you to display results clearly and concisely to your respondents. It is an easy and fast way of displaying any data in rows and columns. Rather than writing your data in text, you can make it more understandable and easy to read with this widget.
  • 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.
Support is the author of this solution article.

Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.