Highlights

Overview

The Scatter/Bubble Chart component allows you to show the correlation between two sets of data.

Overview: Scatter Chart

To create a Scatter Chart, you will assign a set of X-values and Y-values so that the data can be properly plotted on the chart. Here is an example of a Scatter Chart that shows the correlation between volcano eruption duration and the interval for Old Faithful in Yellowstone National Park.

Overview: Bubble Chart

The Bubble Chart allows you to show the correlation between three sets of data. To create a Bubble Chart, you will assign a set of X-values, Y-values, and Z-values so that the data can be properly plotted on the chart. The size of the bubbles is determined by the Z-values.

Here is an example of a Bubble Chart that shows the correlation between age, weight, and hours spent watching television for both genders.

Component Structure

This is the structure of the Scatter Chart component:

This is the structure of the Bubble Chart component:

Key Features

This section provides examples of different ways to use the Scatter and Bubble Chart components.

Choosing a Scatter or Bubble Chart style

The default chart type is a Scatter Chart. You can use the Properties panel to choose between a Scatter and Bubble Chart style.

1. In the Klip Editor, drag a Scatter/Bubble Chart component into the Klip workspace.
2. In the Component Tree, select Scatter Chart.
3. On the Properties panel, select a Chart Type icon. In the image below, the icon that is highlighted represents a Scatter Chart. The icon that is not highlighted represents a Bubble Chart.

Adding a regression line

Regression lines let you see correlations between X and Y values in a Scatter Chart.

1. Select the relevant scatter Series from the Component Tree.
2. On the Properties panel, at Regression, select Draw a regression line.

Customizing the color for each series

You can select a custom color for each series in a Scatter or Bubble chart.

1. In the Component Tree, select the relevant Series.
2. On the Properties panel, at Series Color, select Override the default color.
3. Click the color box to prompt the color selection window to open.
4. Select a color from the available options.
5. Optional: For a custom color, select More Options. Type a hex value in the box. For more information, see Color-Hex (http://www.color-hex.com/).
6. Select Finished.

Assigning labels to points or bubbles in a series

You can assign a name to each point or bubble in a series. The name you assign displays as a tooltip instead of the Series name.

1. On the Component Tree, choose a series, and select its Labels sub-component.
2. Select the Data panel.
3. Select the Insert Function button.
4. In the Functions menu, select ARRAY.
5. Click the Insert literal string or number button.
6. Type a name for the first bubble.
7. Repeat for as many values that exist in your X, Y and Z axis.

You will need to add as many names as there are values to ensure all points or bubbles are assigned a unique name. Otherwise, some points or bubbles might be assigned to the Series name.

Showing and hiding the legend and changing its font size

On the Properties panels of the Scatter/Bubble Chart, you can choose to show or hide the legend and change its font size.

1. In the Component Tree, select Scatter/Bubble Chart.
2. On the Properties panel, at Legend select the box next to Show legend to show the legend (as below) or deselect the box to hide the legend.
3. At Legend Size, use the drop-down to select a font size (Small, Medium, or Large.)
4. Click Save.

Customizing the appearance of the X- and Y-axes

On the Properties panels of the X- and Y-axes, you can customize the way the axes appear on your chart. Options include:

• Choosing a font size for the x-axis and y-axis titles.
• Formatting values.
• Specifying the axis position, line, range and interval.
• Customizing labels and tick marks.
• Showing or hiding grid lines.

Customizing the appearance of the Z-axis

On the Properties panel of the Z-axis, you can customize the way the Z-axis appears on your Bubble Chart. Options include:

• Choosing a font size for the z-axis title.
• Customizing the bubble size.
• Displaying the values of the Z-axis.
• Displaying the series label.
• Customizing label formatting.

Hiding and displaying chart series

You can hide a series by default in the Klip Editor.

1. In the Klip Editor, on the Component Tree, select the Series you would like to hide.
2. On the Properties panel, at Visibility, select Hide this series by default.
3. Save your Klip.

On your dashboard, the hidden series will not appear until you click on the name of the series.

Using zoom to display segments of data

You can enable zoom on your series charts (bar/line and scatter/bubble) to display specific portions of data along the X axis, Y axis, or both axes. 

To enable zoom:

1. In the Klip Editor, on the Component Tree, select Series Chart.
2. On the Properties panel, at Allow Zoom, click the dropdown menu and choose the zoom option you want to use.
3. Click Save and Exit.

To use zoom:

1. On your dashboard, highlight a portion of your chart. The selected portion will expand to allow a more granular view of your data.
   • If you choose Along X axis only, move your mouse pointer across your chart to highlight the data you want to expand.
   • If you choose Along Y axis only, move your mouse pointer up or down your chart to highlight the data you want to expand.
   • If you choose Along both X axis and Y axis, move your mouse pointer in any direction to highlight the data you want to expand.

2. Click Reset zoom to bring the display back to its actual size.

Important Concepts

These articles provide an overview of important concepts for building Klips:

• How to build Table components
• How to build Bar/Line chart components
• How to build Pictograph components