Design overview

Contents[Hide]

This article provides an overview of the design experience in Dundas BI, focusing on creating and editing dashboards and other views such as reports. Some of these editing features are also common to the screens used to edit metric sets, hierarchies, and data cubes, for example.

Elements of the editor include the toolbar at the top, a status bar along the bottom, and the actual design surface with horizontal and vertical rulers. The white, rectangular portion of the design surface represents your dashboard and is generally referred to as the canvas.

You design dashboards and other views simply by dragging items from the Explore window on the right, and placing them on the canvas. For example, drag a metric set to the canvas and it will automatically appear as a chart or other type of visualization showing actual data values. Or, add a label component to the canvas and use the Properties popup or window to change its font size and color.

Dashboard editor
Dashboard editor

Related video: Introducing the Dashboard Designer

1. Elements

Here's a quick tour of the main elements of the user interface (UI) for editing views.

1.1. Toolbar

The toolbar at the top of the screen lets you perform a wide range of design functions. You can copy and paste items from the clipboard, add different types of content to the canvas, or apply a style or theme. Essential operations such as switching to view mode are always visible in the toolbar while the remaining buttons may be scrolled left or right depending on the available space.

Toolbar
Toolbar

Certain operations appear or disappear from the toolbar according to the current selection. For example, if you select a data visualization on the canvas, you'll see a set of toolbar buttons on the right with a blue edge on top. These buttons correspond to operations that apply to the selected data visualization, such as Re-Visualize.

Buttons on the right apply to the current selection
Buttons on the right apply to the current selection

1.2. Status bar

The status bar (also known as a taskbar) displays the name of the current dashboard or view, and lets you rename it as well. Hover over or long-tap the name to see its location, including its project and any subfolders.

Next to the name is a message area that informs you whenever your editing has been auto-saved. Further to the right, you'll find a set of controls for adjusting the zoom level and snap-to-grid options for the canvas. 

Status bar
Status bar

See Using the status bar to learn more.

1.3. Rulers

The horizontal and vertical rulers which are attached to the design surface help you to size and position elements on the canvas. The default units are pixels (px), with the top-left corner of the canvas corresponding to the position (x=0, y=0). The rulers also track the location of your mouse pointer as you move it across the design surface.

Rulers
Rulers

To switch the rulers to percent units, click px. In this mode, the bottom-right corner of the canvas corresponds to the position (x=100%, y=100%).

1.4. Canvas

The canvas is the rectangular portion of the design surface that corresponds to the dashboard (or other view) that you are editing. When you click outside of any content, the toolbar presents options that are applicable to the view itself and the Properties window displays its properties such as Re-Size Mode and Height.

Properties of the canvas (dashboard)
Properties of the canvas (dashboard)

As you drag content around the canvas, a snap grid appears along with dotted lines that make it easy to align it with other elements on the dashboard.

Aligning a label with another element on the canvas
Aligning a label with another element on the canvas

Right-click (or long-tap) over an element on the canvas to open a context menu which gives you convenient access to many of the same functions available from the toolbar.

Context menu for a visualization on the canvas
Context menu for a visualization on the canvas

2. Windows

A set of tabbed windows are docked along the bottom and right sides of the editor. By default, the windows docked on the bottom are collapsed (e.g., the Parameters window), while the ones docked on the right are expanded (e.g., the Explore window). To learn how to work with and arrange these windows, see Using dockable windows.

2.1. Explore

All of the work that you do in Dundas BI occurs within the context of a current project, which allows users to collaborate on the same dashboard or BI effort. The Explore window lets you navigate this current project, which appears as a collection of folders containing files such as data connectors, metric sets, and dashboards, some of which can be expanded further. Almost any of these items can be dragged directly onto the canvas to add it to your view, including all types of data, metric sets, maps, themes, and even other dashboards or views. Expand a dashboard or other view to find its visualizations, which you can drag onto your canvas to reuse.

Explore window
Explore window

Using the Explore window, you can easily switch between different kinds of tasks, from editing dashboards to creating data cubes and more. For example, right-click (or long-tap) on the Metric Sets folder and select New Metric Set to edit a metric set full-screen. Or, click New Folder to create a sub-folder, then right-click and Cut and Paste files to better organize your project items.

Create a new sub-folder
Create a new sub-folder

Tip
You can hold the Shift key while dragging files between folders to move them.

Enter search terms in the Explore search box to quickly find the files you want.

Search for files
Search for files

The toolbar at the top of the Explore window lets you enable checkboxes on project items and apply operations such as check in and check out on multiple files at once. The Explore toolbar is also responsive to the current selection in the treeview and presents similar options to that of the context menu.

Use the Explore toolbar to enable checkboxes and apply operations to multiple files at once
Use the Explore toolbar to enable checkboxes and apply operations to multiple files at once

2.2. Layers

Layers give you a way to organize elements on your canvas as a collective unit, which you can either show or hide while editing, or set up for viewers through interactions to show additional content. When editing a complex dashboard with overlapping elements, you can hide or lock layers that you aren't working on.

Adding a second layer
Adding a second layer

Every view starts with one layer. Even if you don't add any additional ones, the Layers window is useful for navigating around your canvas because it lists all of its elements as well as any interactions such as filtering or scripting.

Hovering over the list of elements
Hovering over the list of elements

For more details, see Layers and groups.

2.3. Properties

Properties are settings you can customize for visualizations, components, or parts of a view such as the dashboard's canvas.

Some of the most common properties can be accessed from the Quick Access Properties panel that appears when selecting any element on the canvas or the canvas itself. All user types can access these properties when editing, which can include various font settings, fill color, and border/outline styling.

Quick Access Properties panel
Quick Access Properties panel

The first time a visualization is selected, the Quick Access Properties lists properties that apply to the whole visualization, such as the overall font and outer border.

Many visualizations contain various elements within them that each have their own settings. Click again on an individual element within it if you want to customize it, such as a cell in a table, a chart axis and its labels, or a data point series in a chart. The Quick Access Properties will update to show the settings that currently apply to that particular element if available.

Quick Access Properties for a chart axis and its font
Quick Access Properties for a chart axis and its font

The full Properties window is available to users with at least a power user seat type, and lets you view and change the complete set of properties available for the selected elements. If no element is selected (e.g., you clicked on the canvas outside of any content), the Properties window shows the properties of your dashboard or whichever type of view you are editing. When multiple elements are selected, you can set any available properties that are in common for those elements all at once.

Properties window
Properties window

Tip
Double-click or right-click a category to expand or collapse them all when navigating through many properties.

The Properties window is normally docked to the side, but you can also right-click (or long-tap) and choose Properties to open it. Similar to the Quick Access Properties, after first selecting a visualization, you can click or right-click a particular element within the visualization to select it and open the relevant subset of properties.

Opening series properties from the context menu
Opening series properties from the context menu

The Properties window also gives you access to the complete set of actions lists supported by that element, allowing you to add actions to customize behavior when an event occurs while viewing. See Using interactions for more.

2.4. Script Editor

The script editor lets developers write JavaScript code using the API to further customize and enhance views beyond the built-in interactions. Various script examples can be found in our script library.

Built-in Script Editor with auto-complete support
Built-in Script Editor with auto-complete support

2.5. Parameters

View parameters pass a filter value to one or more metric sets and data visualizations. These are used to connect filters with your visualizations to pass them your selected filter values, or they can be created on their own without a filter control.

Open the Parameters window to view and manage the parameters defined on your dashboard, report, or other view.

Parameters window
Parameters window

Visualizations can also act as filters, so that you can click directly on data to filter, drill down, navigate to details and more. See Using interactions for the types of interactions that are available.

The Brush View Parameter that appears by default in the Parameters window is used for data brushing, which is a built-in feature that allows you to select or hover over data in one visualization and have it automatically selected in another. The brush view parameter facilitates communication between different data visualizations on your view, indicating the data item based on its measure and hierarchy values, and highlighting all the matching data items.

You can open the Properties window for the view (click an empty part of the canvas to de-select any elements) to change the view parameter used for data brushing or disable automatic brushing.

Brushing properties for the dashboard
Brushing properties for the dashboard

With automatic brushing disabled, you can set up your own custom brushing or selection behavior by setting up a filter interaction with the Brush View Parameter as the target parameter.

Note
For charts and tables that load additional data as you scroll or zoom, only the loaded data can be passed through parameters.

2.6. Data Preview

Select a data visualization on the canvas if you are editing a dashboard or view, and then open the Data Preview window to see the underlying data values displayed in a table. Note that the displayed preview may differ from the resulting data visualization, for example totals are normally hidden in charts. 

Hover over a table cell, or click to select a row or column in the Data Preview window, and corresponding data will be highlighted in your own visualizations. This is an example of the automatic data brushing in Dundas BI.

Data Preview window
Data Preview window

Clicking to select rows or columns will also display corresponding statistics in the status bar.

The Data Preview window also lets you view performance measurements and warning messages related to data retrieval for the selected data visualization on the canvas.

Performance measurements
Performance measurements

Note
The performance measurements and warnings shown when nothing is selected reflect only the First load information, and will not update with changes to the dashboard.

3. Data Analysis Panel

For every data visualization, there is a corresponding metric set that encapsulates the data that is being visualized, and settings that determine what each part of the data is used for by the current visualization.

Modifying all data-related settings is done using the Data Analysis Panel. Contrast this with the Properties window, which you use for customizing the specific visualization such as its appearance, animation, and interactivity.

Right-click on a data visualization to open its Data Analysis Panel
Right-click on a data visualization to open its Data Analysis Panel

If the metric set is checked out to you, you can directly add or remove measures and hierarchies from the Data Analysis Panel. Use the buttons at the top of the Data Analysis Panel to make other changes to the metric set (including overrides) or the visualization.

See Metric set analysis tools, Slicers versus columns and rows, and Setting up the visualization for more details on using the Data Analysis Panel.

4. See also

Dundas Data Visualization, Inc.
400-15 Gervais Drive
Toronto, ON, Canada
M3C 1Y8

North America: 1.800.463.1492
International: 1.416.467.5100

Dundas Support Hours:
Phone: 9am-6pm, ET, Mon-Fri
Email: 7am-6pm, ET, Mon-Fri