Container

Introduction

Feature(s)

A container can be viewed as a canvas. You can put multiple charts and components into a container and arrange them as a whole.

Application Scenario(s)

In the case of data analysis, you need to arrange charts of the same type together and analyze them.

For example, put the charts concerning sales metrics in one container to check and manage them.

Preview

The data related to the sales presentation will be displayed in a container.

Setting Procedure

You have to prepare form data in advance.

Note:

All dashboards in apps allow using containers.

Creating a Dashboard

Create a dashboard.

Creating a Container

On the Design page, click Container to add a container:

Setting the Container

1. Rename the container.

After adding a container, rename it according to business needs.

2. Hide/display the container.

The title of the container can be hidden.

Multiple Tabs

1. Enable multiple tabs.

On the container editing page, enable Tabs to add multiple tabs. Multiple charts can be placed in each tab, which is equivalent to the combination of multiple containers.

Note:

After enabling Tabs, ten tabs can be added to a container at most and two tabs at least.

2. Set the automatic pagination.

In a container, after enabling Tabs, enable Auto Pagination and set Interval.

The effect of Auto Pagination is shown in the following figure.

Note:

1. Auto Pagination is only available on PC.

2. This is an advanced feature that requires the Standard or above plans. For details, contact our Sales Team.

3. Rename/sort/delete tabs.

You can rename, sort, and delete tabs.

  • Rename: Up to 20 characters can be entered.
  • Sort: You can sort tabs by dragging and dropping directly.
  • Delete: After a tab is deleted, the chart in it will be moved to the first tab by default and positioned after the existing charts.

Add Chart(s)/Component(s)

Add required charts/components to the container. You can either create a chart/component directly and drag it into the container, or add the existing chart/component to it.

1. Create a chart/component directly.

Charts/components can be added in the following ways:

  • When the container is selected, you can click the chart/component on the left to add.
  • When the container is not selected, you can directly drag the chart/component from the left to the container. If there are multiple tabs, the chart/component will be dragged to the selected tab.

Take creating a stats as an example: select Stats, drag it to the container, select the data source, and click OK to set.

For details about setting a chart, see Chart.

2. Add an existing chart/component.

To add an existing chart, select the chart and click Move to move it into the canvas to add.

If you enable Tabs in a container, select one certain tab to move the chart.

Note:

You can press COMMAND or CTRL, and select multiple charts to move them in batches.

Setting the Container Size

1. Size requirements

You can customize the container size as follows:

a. On PC:

  • Minmum: 10/60, six grids
  • Maximum: full, 150 grids
  • One grid equals 15 px.

b. On Mobile:

  • Minmum: full, 6*40 px.
  • The height is not limited until all charts are displayed completely.

2. Size settings

a. Set the size on PC.

You can adjust the container size manually or by setting Adjust Size.

b. Set the size on mobile.

3. Size rules

a. The size adjustment of the chart/component inside the container is the same as that of the default canvas outside the container.

b. Adjusting the chart/component size to 1/2 or 1/3 is to adjust the container width, not the width of the whole dashboard.

Adjusting the Container Position

1. Adjust the position of the container as a whole.

a. On PC

When you adjust the position of a container, charts/components in the container will be also adjusted as a whole.

b. On Mobile

2. Adjust the position of the chart/component.

a. On PC

The chart/component position in the container is adjusted as that of the default canvas is adjusted in the dashboard.

b. On Mobile

Deleting a Container

You cannot delete a container with charts, components, and so on.

To delete the container, you need to delete or hide all charts or components in it first before deleting it.

Demonstration

1. On PC

The container is displayed on PC as follows.

You can also configure more charts/components according to business needs.

2. On Mobile

Note(s)

1. You can edit and delete a container, but cannot copy it.

2. If a container is empty, it can be deleted. If not, you need to delete or hide the charts/components in the container before deleting the container.

3. A container itself does not allow hiding, but the charts in the container allows. For details, see Hiding a Chart/Component.

4. The charts/components added to the container do not allow dragging out the container directly. You need to select the charts/components and click to replace the container.

5. Except for the container, all other charts and components allow being added to the container. That is, containers do not allow nesting each other.

6. The shadow of the chart and component in the container is canceled and the title of the chart/component is centered.

7. Up to 100 charts/components can be added to one dashboard. This also applies to a container.

8. Up to ten tabs can be set in a container.

Was this information helpful?
Yes
NoNo
Need more help? Contact support