• To define domain-specific data requirements.

• To transform your business data into dazzling assets by changing the outlook of your data.

• To avail an extensive range of advanced charts.

• To drill down up to any granularity level with the help of SDK methods.

• To dynamically customize UI and UX of the current charts.

• To deliver clear insights at the speed of thought by altering multiple widgets and applying various filters to your governed dashboards.

The designer module is a complete package to create governed dashboards with pre-built charting capabilities that make it simple enough for business users to understand their business data, yet robust enough to accommodate complex custom scripting. High-level visualizations backed with accurate predictions and real-time updates are available at seamless speed to provide precise insights to users and help them make informed business decisions.

The Designer module comes preloaded with a wide range of charts, features, and data integration capabilities that empower the users to create informative and appealing visual representations of their data.

• Extract and consolidate live data from a variety of data sources ranging from an Excel spreadsheet to a Data Store connection.

• Merge two data connectors of diverse nature such as excel, and a data service based on an underlying criterion.

• Users can compare metrics, create calculated fields, and use them as input, on top of the merged dataset.

• Get real-time data updates in seconds using the WebSocket URL.

​

This section covers steps to access the Designer module from the Platform Apps menu.

• Navigate to the Homepage of the platform.

• Click the Apps menu icon.

• Click the Designer module.

• The Designer homepage opens.

This section aims to give an overview of the Dashboard Designer focusing on the two main screens that appear under the Designer module: Homepage and Designer Canvas.

• Navigate to the Designer homepage.

• Click the Manage option.

• The user gets directed to manage the following tasks for a Workspace or Dashboard:

Tasks for a Workspace

• Search in Workspaces: Searches for a specific Workspace.

• Reload Workspaces: Reloads all the Workspaces.

• New Workspace: Adds a new Workspace.

• Rename: Renames the selected workspace.

• Remove: Removes the selected workspace from the list and move to the Trash Workspace.

• Share: Shares the selected workspace to a user or user group. The rights to access an already shared workspace can be excluded by using the same option.

• Empty the Trash: Removes all the workspaces from the Trash workspace.

Tasks for a Dashboard

To access the options, the users need to select a dashboard from an existing workspace as displayed in the following image:

• Search: Searches for a Dashboard

• GIT Export: Export a dashboard to GIT and get a pushed version from the GIT repository (Push to VCS and Pull from VCS)

• Open in Designer: Opens the dashboard in Designer to Edit or modify

• Publish to Portal: Publishes the Dashboard to the portal

• Remove: Deletes the Dashboard

• Actions: Applies the various actions on a dashboard

The users get the following options while clicking the More Actions icon provided for a Dashboard.

1. Preview the dashboard

2. Export to Local Disk

3. Rename the Dashboard

4. Delete Dashboard

5. Move the Dashboard from one Workspace to another Workspace

The Designer homepage displays a list of tasks in the left panel that users can perform on a dashboard.

• The users can add a new Dashboard/Workspace,

• Manage the existing Dashboard(s)/Workspace(s),

• Set preferences for a dashboard,

• Save the dashboard with a different name

• Open it from the local disk if saved there

• Exit the Designer plugin.

The Designer Homepage also contains Guided Tour.

• Navigate to the Designer homepage.

• Open the Manage option.

• Open an existing dashboard from the list of available dashboards (You can find the list of dashboards inside a Workspace).

• Click the Save As option from the left panel.

• The Save As window appears to confirm the action.

• The original dashboard name appears with the “Copy_Of” prefix (the users can edit the name as per their wish).

• Select a workspace from the drop-down menu.

• Click the Save option.

• A copy of the selected dashboard gets saved in the chosen workspace.

• Navigate to the Designer homepage.

• Click the Open option from the given options.

• The Open from Local Disk appears.

• The user gets directed to open the downloaded files (.bvzx) from the local disk.

• The selected dashboard (.bvzx file) opens inside the designer workspace.

• Navigate to the Designer homepage.

• Click the New drop-down menu.

• The user gets two options:

  • Workspace: Clicking this option redirect the users to create a new workspace/place holder for the dashboard.

  • Dashboard: By clicking this option, the users get redirected to the Designer Canvass to create a new dashboard.

The user gets guided across various important sections of the Designer plugin. The tour begins from the Designer Homepage.

• Click the Take a tour option provided on the top right side of the Designer homepage.

• A new dialog box opens initiating the landing page tour.

• Click the Next option to move ahead in the guided tour.

• Click the Prev option to go back to the guided tour.

• Click the End Tour option if you want to end the tour at any given point (The End Tour option will get highlighted by default at the end of the guided tour).

Preferences

• Navigate to the Designer homepage.

• Click the Preferences option from the left panel.

• The Preferences for a dashboard canvass appear.

• Set the desired preferences either by enabling it through a checkmark or selecting it from the provided menus.

• Click the Save option.

• The selected preferences get applied to the dashboard canvass.

• The available preferences for a dashboard are as described below:

• Navigate to the Dashboard canvas.

• Click the Data Connectors icon.

• A page opens displaying various options to establish data connections.

Every component in the dashboard is considered as an object. The Designer canvas page offers an icon to access the Dashboard Objects and the various related properties to manage the dashboard components.

• Navigate to the Dashboard canvas.

• Click the Manage Dashboard Components icon.

• A panel opens displaying various icons for the used dashboard objects (The following image displays empty dashboard, so no objects are mentioned).

Dashboard Canvas Page

• Navigate to the Designer homepage.

• Click the Add Dashboard icon on the homepage.

or

• Click the New drop-down icon on the homepage.

• Select the Dashboard option.

• The Designer space/Canvas opens with a Designer Canvas space, header menu panel, and a right-side menu panel.

The user can access wide range of charting components, filters, and Grid components available in the Designer module from the Designer canvas page to create a dashboard.

Refer to the following image to understand the various components provided on the Designer Canvas:

1. Tab: Place where dashboard design takes place. Drag and drop charts and components here to create dashboards.

2. Mobile : Displays Dashboard screen like a Mobile device.

3. Tablet : Displays Dashboard screen like Tablet.

4. Large Screen : Displays Dashboard screen like Desktop.

5. Save to Local Disk : Saves the created dashboards to your local disk.

6. Save to Another Workspace (Save As) : Saves a copy of the original dashboard to another workspace or the same workspace.

7. Save (Dashboard) : Saves the created dashboards in a workspace.

8. Preview : Displays the preview mode of the dashboard.

9. Full Screen : Maximizes the dashboard for a better view.

10. Data Connectors : Connects to a wide range of data sources.

11. Component Library : Includes a compelling range of charts, filters, and data grids.

12. Manage Dashboard Components : Option used to lock, hide, and order the layout of the components on the dashboard.

13. Component Variables and Script : Option used to define component scripts.

14. Guided Tour : Begins the guided tour for the Designer canvas.

• Navigate to the Designer homepage.

• Click the Exit option.

• If work is not saved, the user gets an option while closing to leave or cancel the action of exit. Select the Cancel option if you require to save the work, or else choose Leave to close the designer.

• The user gets directed to the Platform homepage.

Help

• Navigate to the Designer homepage.

• Click the Help option.

• The Help content gets displayed to understand the Designer plugin.

The scripting mechanism makes the creation of complex dashboards easy and quick. The users get an icon to access the scripting window on the Designer Canvas page.

• Navigate to the Dashboard canvas.

• Click the Component Variable and Script icon.

• The user gets redirected to the scripting window displaying the Components and Connections tabs to open the related panel for the each option. The Components tab opens by default.

The user can avail a guided tour to the Designer canvas page using the Guided Tour icon provided on the right side panel.

• Navigate to the Designer Canvas page.

• Click the Guided Tour icon.

• Click the Next option to move forward.

• It redirects the users on the icon to open the Dashboard Canvas page.

• Click the Prev option to go to the back page.

• Click the End tour option to close the guided tour window at any given point.​

The Designer canvas page offers an icon to access the supported charting components for the dashboard creation.

• Navigate to the Dashboard canvas.

• Click the Component Library icon.

• A panel opens displaying various charting options to choose from.

The Global Properties feature in the Dashboard canvas empowers users to apply appearance properties at the dashboard level. These properties facilitate the seamless alignment of various dashboard components, ensuring a consistent and visually harmonious display.

Accessing the Global Properties Icon

• Navigate to a Dashboard within its canvas framework.

• Use right-click to get the Dashboard context menu.

• Click the Properties option from the context menu.

• The Dashboard Properties gets listed in a context menu.

• Select the Global Font and Themes option.

• The Global Properties icon can be accessed within it.

• By clicking on the Global Properties icon, the Global Properties Selection window opens displaying a list of the Global Properties that can be set or modified at the dashboard level.

Various Global Properties

The Global Properties feature streamlines the design process and saves time by providing a single point to manage appearance settings for the entire dashboard.

A dashboard is provided with the below-given Global Properties:

Enable Global Property for Background

Apply a border for all the dashboard components and set color and radius of the border for all components enabling the Global Property for Background.

Enable Global Property for Title

The Global Properties for the dashboard title ensure consistent branding and visual coherence throughout the entire dashboard. It helps the user to effectively convey the purpose behind the selected dashboard by aligning the Title display together with Title Bar height, Font color, Font Size, Font Style, font Weight, and Font family. It also allows to enable decoration for the inserted Title text.

Enable Global Property for Sub Title

The Global Sub-title Properties feature in the Dashboard application enables users to apply appearance properties at the dashboard level for sub-titles. By utilizing Global Sub-title Properties, users can ensure consistency and visual harmony across all sub-titles in the dashboard.

Enable Global Property for X Axis

By utilizing Global Properties for the X-axis, users can ensure consistency and visual coherence across all charts and graphs in the dashboard that use the X-axis. It helps to bring in uniformity for all the dashboard components containing X-Axis in terms of Label appearance and readability.

Enable Global Property for Y Axis

Ensure consistency and visual coherence across all the charts in the dashboard by utilizing Global Properties for the Y-axis. It helps to standardize all the dashboard components containing Y-Axis in terms of Label appearance, readability, and text decoration.

Enable Global Property for Legend

The Global Properties for Legend allows the user to customize the appearance properties of the legend to align with your design preferences.

Enable Global Property for Formatter

The Global Properties for Formatter allows the user to standardize various formatter related properties .

The user must click the Save option after setting or modifying the desired set of Global Properties to apply them on the selected dashboard.

The Designer module provides visually captivating and appealing themes under the Dashboard Properties, so that the users can effortlessly and instantly transform their dashboard’s appearance. The user can seamlessly switch between different themes with an intuitive drop-down menu.

Steps to Apply Various Themes on a Dashboard

• Navigate to a Dashboard within its canvas framework.

• Use right-click to get the Dashboard context menu.

• Click the Properties option from the context menu.

• The Dashboard Properties gets listed in a context menu.

• Select the Global Font and Themes option.

• Click the Designer Themes icon.

• The Dashboard Theme Selection window opens.

• Click the Theme List drop-down option to access the list of all the available dashboard themes.

• Select a theme from the drop-down list.

• The selected theme appears in the Theme List field.

• Click the Save option.

• The selected theme gets applied to the dashboard.

Available Pre-defined Themes

The supported themes are as given-below (Click on each tab to open the embedded theme display).

The Designer canvass is provided with specific properties.

• Navigate to the Designer canvas.

• Use the Right-click anywhere on the canvas to get the Dashboard properties.

• Select the Properties option from the context menu.

• Various Dashboard level properties get listed in the displayed context menu as shown in the below-given image:​​

Gradient

Border

Global Font And Themes

​

• Select the Global Font And Themes option from the context menu.

• Click on the Designer themes icon.

Screen Size

The Size Properties option helps to

​

Steps to set the Screen Size

• Click the drop-down icon for the Screen Size field.

• A context menu appears displaying various options to set the Screen Size.

Language Mapping

​

Please Note: By clicking on the Select a Mapping icon, the Language Mapping Selection dialog box opens.

Steps to Map a Language

• Navigate to the Language Mapping Selection dialog box.

• Select a language mapping option using the Mapping List drop-down menu.

• Click the Save option.

Cache

Use a checkmark in the given box to enable the Enable Cache option for the data service. If cache is enabled for a dashboard with a data service as a data source it will do the following tasks:

• While loading the dashboard, for the first time data will hit from database.

• The same dashboard while loading again it will load the data from the Cache.

Report Burst

Use a checkmark in the given box to Enable Report Burst. By enabling the Report Burst option from the Dashboard properties displays the Report Burst option for a published Dashboard. Refer the Report Burst section from the Options for a Published Dashboard section for more details.

Workspace once created under the Designer module works as a placeholder for multiple dashboards. If you compare a dashboard with a document/file, then the Workspace created to store them is like a folder. The creation of a new Workspace and understanding the various credited options to an available Workspace under the Designer module are aimed to be explained through an illustration. Check out the given walk-through on the complete flow of Workspace creation.

Workspace once created under the Designer module works as a placeholder for multiple dashboards. If you compare a dashboard with a document/file, then the Workspace created to store them is like a folder. The creation of a new Workspace and understanding the various credited options to an available Workspace under the Designer module are aimed to be explained through an illustration.

• Navigate to the Dashboard Designer homepage.

• Click New or click the Add option.

• Click Workspace from the context menu.

• A dialog box appears.

• Workspace Name: Enter a title for the Workspace in the given field.

• Click the Save option.

• A confirmation message appears to inform the creation of a new Workspace.

• The newly created workspace gets saved under the list of the existing Workspaces (The list of the Workspaces can be seen under the Manage option).

This page describes the steps to access the Context Menu Properties:

• Drag multiple components into the designer canvas (At least three components to avail all the properties).

• Select multiple components from the canvas(at least three).

• Use right-click to open the context menu.

  • The following properties will be listed in the context menu:

    • Align Left: All the selected components get aligned to the left.

    • Align Right: All the selected components get aligned to the right.

    • Align Top: All the selected components get aligned to the top.

    • Align Bottom: All the selected components get aligned to the bottom.

    • Align Horizontal: All the selected components get aligned horizontally.

    • Align Vertical: All the selected components get aligned vertically.

    • Equal Space (Horizontal): All the selected components get equal space horizontally.

    • Equal Space (Vertical): All the selected components get equal space vertically.

    • Equal Height: All the selected components get an equal height.

    • Equal Width: All the selected components get an equal width.

    • Manage Group: The user gets redirected to manage the group.

    • Lock Selected: All the selected components get locked.

    • Unlock Selected: All the selected components get unlocked.

    • Delete Selected: To delete the selected components.

    • Duplicate Selected : To duplicate the selected components.

    ​

• Each dragged component gets some Context Menu Properties as shown in the below image:

• Select a workspace from the Workspaces list.

• Click the Rename icon.

• The Rename window appears to assure the action.

• Provide a new name for the dashboard.

• Click the Rename to save the new name.

• A message appears to assure the success of the renaming action.

• The selected workspace gets saved with the new name.

​

Sharing a Workspace

• Open the Manage option.

• Navigate to the Workspaces section.

• Select a Workspace from the list.

• Click the Share Workspace icon.

• The Manage Access window opens.

• Select permissions using the Grant Permissions.

• The Users, User Groups, and Exclude Users tabs will be displayed. Choose users or user groups tabs to share the workspace.

• Search specific users or user groups using the Search bar.

• Select a user or user group using checkboxes.

• Click the Share option.

• A notification message appears.

• Re-open the Manage Access window.

• The selected user/ user group gets listed under the Granted Permissions section.

Revoking Privileges for a Shared Workspace

• Open the Manage Access window for a shared Workspace.

• Navigate to the Granted Permissions section.

• Select a user/ user group from the Granted Permissions section.

• Click the Revoke icon.

• The Revoke dialog box opens.

• Click the Yes option to revoke the permission.

• A notification message appears and the privileges get revoked.

Excluding Users from Accessing a Workspace

• Open the Manage Access window for a Workspace.

• Select permissions using the given checkboxes for the Grant Permissions.

• The Users, User Groups, and Exclude Users tabs display. Select the User Groups tab to share a workspace.

• Search a specific user/ user group using the Search bar.

• Select a user group by using a checkbox.

• Navigate to the Exclude Users tab.

• Select users using the checkboxes.

• Click the Share option.

• A notification message appears.

• Re-open the Manage Access window.

• The excluded user(s) will be listed under the Excluded Users section.

This section describes steps to delete an existing Workspace and restoring the deleted workspace.

Removing a Workspace

• Select a workspace from the Workspaces list.

• Click the Remove icon.​

• The Remove dialog window appears to confirm the deletion.

• Click the Remove option.

• The selected workspace gets removed from the list.

• The removed workspace gets added to the Trash Workspace.

Restoring a Deleted Workspace

• Click the Manage option.

• Navigate to the Trash workspace created under the list of all the workspaces.

• Select a deleted workspace that you want to restore and click the Restore icon.

This section covers two ways to add a new Dashboard.

• Navigate to the Designer homepage.

• Click the New drop-down menu and select Dashboard.

Or

• Click on the ‘+’ icon, the users get redirected to the Designer Canvas.

To create a dashboard the user needs to go through multiple pages and use various options provided under the Designer module. It begins with adding a new Dashboard and goes all the way to create a data connection, drag multiple charting components, associate the created data connections with the dragged charts, preview the dashboard data, and finally save the created dashboard.

• Click the Component Library icon from the right edge of the window.

• Various categories of the available charting components get displayed (The Charts category gets selected by default).

• Select and drag a component on the canvas.

• Right click on the dragged component.

• Select the Dataset property option.

• Select the created connection from the list.

• Drag the required fields.

• Click the Data Connectors icon to display all the available data sources.

• Click the Create New Connection icon provided next to the Data Service connector.

• A new connection gets added under the Data Service connector type.

  • Name: Name the connection.

  • Data Connectors: Select a data source from the drop-down menu.

  • Data Sets: Select a data service from the drop-down menu.

• Navigate to the Dashboard canvas page.

• Click the Preview icon.

• The selected Dashboard opens in the Preview mode.

The page focuses on the various options provided for a saved dashboard while using the Manage option.

Manage and share your work with others. This section explains how to edit, save, and publish the dashboards created by users.

Generally created dashboards are saved under a workspace. Based on the requirement, the users can edit the dashboards by adding some modifications and saving them to the disk. This tutorial explains how to edit, open, and save dashboards.

The created and saved dashboards can be shared among the users for a purpose. There are options provided to move and publish dashboards.

The below given description helps you how to access those options in the Designer:

• Navigate to the Designer homepage.

• Click the Manage option.

• A list of Workspaces gets displayed.

• Choose a workspace.

• A list of all the saved dashboards under the selected workspace gets displayed.

• Options provided next to a dashboard name can be used to manage or move that dashboard.

Options provided to a Dashboard:

Options provided under the More Actions:​

The users can open the desired dashboard into the designer workspace once they have created and saved it to a workspace.

• Click the Manage option on the Designer homepage.

• Select and click on a workspace from the list of Workspaces.

• Select a Dashboard from the list of all the saved dashboards under the selected workspace.

• Click the Open in Designer icon.

• The selected dashboard opens in the designer workspace.

Sharing a Dashboard

• Open the Manage option.

• Open a Workspace from the list of workspaces.

• Select a dashboard from the list of dashboards.

• Click the Share Dashboard icon for the selected dashboard.
• The Manage Access window opens for the selected dashboard.

• Select permissions using the checkboxes provided for the Grant Permissions.

• Use the User List or User Groups option to select user(s)/user group(s) to share the dashboard.

• Search for the user or user group using the search bar.

• Use the checkboxes to select the user(s) or user group(s) you want to share the dashboard. ​

• Click the Share option.
• A success message ensures that the dashboard is shared successfully. ​

• Open the Share Dashboard window again for the same dashboard, the user to whom it has been shared will be listed under the Granted Permissions section.

• Navigate to the target user's account, and access the Designer module. Open the Manage section. The shared dashboard gets notified by the letter 's' next to the dashboard name. Even the workspace will be notified with 's' next to it indicating that it is a shared workspace.

Excluding Users

• Navigate to the Share Dashboard window.

• Choose permissions from the Grant Permissions section.

• Go to the User Groups tab.

• Search for a specific user group using the search bar.

• Select a user group using the checkbox. The user is allowed to select multiple user groups.

• Open the Exclude User tab.

• Select users whom you wish to exclude by using the checkboxes.

• Click the Share option.
• A notification message ensures the dashboard is shared with the user group.
• Open the Manage Access window again for the same dashboard.

• The excluded users will be listed under the Excluded Users section.

Revoking the Privilege(s)

• Navigate to the Manage Access window for a shared dashboard.

• The user(s)/ user group(s) to whom the dashboard has been shared appears under the Granted Permissions section.

• Select a user or user group from the Granted Permissions section.

• Click the Revoke icon.
• The Revoke window appears to confirm the action.

• Click the Yes option.

• A notification message appears.

• The selected user or user group's privileges would be revoked for that dashboard. The selected user or group will be removed from the Granted Permissions section.

The users will get the alert notification when multiple users are working on the same dashboard. The alert message will pop-up while one of them would like to save the updates on the same dashboard.

The user who gets the Alert Notification has two choices:

Please check out the following scenario to understand how the User Alert Notification functionality works.

• A dashboard is shared to multiple users.

• If more than one users are working parallelly on the same dashboard and one of the users i.e., User-A saves the dashboard to save the updates added by him in the dashboard. A notification message appears and all the updates committed by the User-A gets saved.

• All the other users (i.e., User-B and User-C) who are working still on the same dashboard will receive an alert notification as displayed in the below-given image.

• They can either accept it by clicking the Yes option or deny it by using the Cancel option.

• If the User-B accepts the alert, then User-B's dashboard will get closed.

• There is a User-C who has cancelled the alert option. So, User-C can continue the work on the same dashboard.

Pushing a Dashboard to VCS

• Click the Manage option.

• Select and open a Workspace from the list of Workspaces.

• Select a dashboard from the dashboard list.

• Click the Push to VCS icon for the selected dashboard.

• The Push into Version Controlling System dialog box opens.

• Provide a commit message.

• Select a Push Type out of Dashboard Versioning and GIT Export

• Click the Push option.

• A Confirmation message appears and the selected dashboard version gets pushed to VCS.

Pull from the VCS

• Click the Manage option.

• Select and open a Workspace from the list of Workspaces.

• Select a dashboard from the dashboard list.

• Click the Pull from VCS icon for the selected dashboard.

• The Pull from Version Controlling System dialog box opens.

• Select a Version by using the given checkbox.

• Click the Pull option.

• A confirmation message appears and the selected version of the dashboard gets pulled.

Dashboards need to be published for end-users to access them. This section explains the steps to publish dashboards.

Publishing to Portal

• Click the Manage option on the Designer homepage.

• Select and click on a workspace from the list of Workspaces.

• Select a Dashboard from the list of the saved dashboards under the selected workspace.

• Click the Publish to Portal icon.

• The Publish dialog box appears to assure the action with the dashboard name and description.

• Select Folder Location using the drop-down icon.

  • The supported folders are My Documents and Public Documents.

• The user needs to specify a user or user group using the following options:

  • User List: To select a user or multiple users by using a checkmark in the box.

  • User Groups: To select a user group or multiple user groups by using a checkmark in the box.

  • Exclude User: To exclude a user or multiple users by using a checkmark in the box.

• Click the Publish option.

• Two consecutive notification messages appear to assure the completion of the action.​

• The selected dashboard gets published at the desired place.

Republish

• For the published dashboard, the below-given dialog box appears while clicking the Publish to Portal icon.

• Select an action option out of Re-Publish or Publish as New.

  • The Republish option if selected displays the following details:

    • The available version(s) of the published dashboard. The user can select a version to republish.

    • The selected user(s) or user group(s) gets appeared in the dialog box.

    ​

  ​

Publish as New

• The Publish as New action allows the user to publish the selected dashboard as new.

• Select Use(s) or User Group(s) using either USER LIST or USER GROUPS tab.

• Select the desired user(s) or user group(s) using check marks in the given check boxes.

The Designer module contains three types of Save options for a Dashboard. They are as explained below:

Saving a Dashboard

• Click the Save icon from the Designer canvas header menu.

• A pop-up window appears with the following details:

• Dashboard Name: The name of the selected dashboard gets displayed.

• Workspace: Select a workspace via the drop-down menu.

• Click the Save option.

• A success message appears to assure the same.

• The dashboard gets saved to the selected workspace.

Save As: Save to Another Workspace

• Click the Save to Another Workspace icon from the Designer canvas header menu.

• The Save As pop-up window appears asking to save a copy of the selected dashboard.

• Name: The dashboard name gets displayed as Copy_of_ the original Dashboard Name.

• Workspace: Select a workspace from the workspace drop-down menu.

• Click the Save option.

• Two consecutive notification messages appear.

• A copy of the selected dashboard gets saved in another workspace.

Save to Local Disk

A dashboard can be saved to a local disk via the Save to Local Disk option.

• Click the Save to Local Disk icon from the Designer canvas header menu.

• The selected dashboard gets saved to the local system.

Previously created dashboards can be renamed using this option. This part provides steps on how to rename an existing dashboard.

• Select a dashboard using the Manage option.

• Click the Rename icon from the More Actions context menu.

• The Rename window appears.

• Enter a new name for the selected dashboard.

• Click the Rename option to save the new name.

• A success message appears.

• The selected dashboard gets renamed.

The Preview action option opens the selected dashboard in the preview mode.

• Navigate to a saved dashboard using the Manage option.

• Select a dashboard and click the More Actions icon.

• Choose the Preview action from the context menu.

• The selected dashboard opens in Preview mode.

Deleting a Dashboard

Users can delete a dashboard by following the steps explained over here.

• Select a dashboard using the Manage option.

• Click the Delete icon from the More Actions context menu.

• A pop-up window appears to confirm the deletion.

• Select the Remove option from the pop-up window.

• A message appears to notify the completion of the action and the selected dashboard gets removed from the list.

Restoring a Deleted Dashboard

By default, the dashboard gets moved to the Trash Workspace. The users can open the Trash Workspace and restore the dashboard to the desired workspace.

• Click the Manage option from the Designer homepage.

• Navigate to the Trash workspace created under the list of all the workspaces.

• Select a deleted dashboard that you want to restore Click the Restore icon.

• The Restore window appears.

• Select a workspace using the drop-down menu.

• Click the Restore option.

• A success message appears to assure the restoration.

• The dashboard gets restored to the selected workspace.

The users can move the created dashboards from one workspace to another using this option. This section explains the steps to move dashboards.

• Select a dashboard using the Manage option.

• Click the Move to icon from the More Actions context menu.

• The Move to Another Workspace window appears.

• Select a Workspace from the drop-down menu.

• Click the Move option to move the selected dashboard into the desired workspace.

• A success message appears.

• The dashboard gets moved to the selected Workspace.

• Click the Manage option from the Designer Homepage Left Menu Panel.

• Select a Workspace from the list of available Workspaces.

• A list of available Dashboards inside the selected Workspace opens.

• Select a Dashboard from the list.

• Click the Action menu icon for the dashboard.

• Click the Info icon from the Action menu.

• The Dashboard Info window opens displaying the related information such as Last Updated Date and Last Updated By.

The Save as Template option has been provided under the More Actions menu for each saved dashboard. By clicking this option it will create the selected dashboard as a Card in the Templates section.

• Navigate to the saved Dashboards list using the Manage option.

• Select a Dashboard from the list.

• Click the More Actions icon for the selected dashboard.

• Click the Save as Template option from the More Actions context menu.

• The Save as Template dialog box opens.

• Provide the Template Name in the given space.

• Click the Save option.

• A notification message appears to inform the completion of the action.

• Click the Templates option provided under the Open option from the Designer homepage.

• The Dashboard Templates page opens listing all the available dashboard templates.

• The recently saved dashboard template gets listed under the Dashboard Templates page.

• A new screen opens, displaying the following data connection options:

  • CSV

  • Excel

  • Data Service

  • Data Store

  • Data Sheet

  • WebSocket

  • Merged Data

• Select a data connection type and click the Create New Connection icon.

• A new connection appears below.

• Configure the required details to create a data connection.

Creating a New CSV Connection

• Click the Data Connectors icon to display all the available data connector types.

• Click the Create New Connection icon provided next to the CSV option.

• A new connection gets added under the CSV connection type.

• Click the connection to display the connection-specific details.

• Configure the following information:

  • Name: Name the connection.

  • Browse: Click the Browse icon to browse a CSV file.

  • Load at Start: Enable this option to get the updated data from the data source before loading it into charts.

• The Field Set tab displays all the fields after establishing the data connection.

Condition

• Select the Condition tab.

• Provide a condition to be applied as a filter on the selected data by putting a checkmark in the given box.

  • E.g., As displayed in the following image, specific date has been provided under the Conditions column for the Timeline so, data for the given date will be taken.

Calculated Fields

The users can add a calculated field by using this tab.

• Navigate to the Data Connectors page.

• Create a connection by selecting a specific Data Connector type.

• Connect to the desired data source to access the available fields.

• Click the Calculated Fields tab.

• The Calculated Field Editor dialog box opens.

  • Name: Provide a name for the calculated field

  • Script Editor: Use the Script Editor space to insert the desired calculation formula using the rule given below.

• Click the Create option to create the calculated field.

Script on Load for a Data Connection

The users can apply their modifications or preferences at the connection level using the Scripting window to get the modified data.

• Navigate to the Data Connectors page.

• Select a Data Connector type.

• Create a new Connection and configure it.

• Select the Script on Load icon provided next to the connection.

• The Script tab appears to trigger a script to produce some action on the data connection.

• The user can also use a script for the Dashboard, which can be accessed via the Components tab.

• The user can search the script for the Dashboard, which can be accessed via the Script tab.

Opening the Scripting Help/ Advanced Scripting

• Click the Help icon from the Script on the Load page.

• The Scripting Help tab opens with some predefined scripts.

• Click the Advanced Scripting option to display the chart-wise advanced scripts.

• Click the Data Connectors icon to display all the available data sources.

• Click the Create New Connection icon provided next to the Data Service connector.

• A new connection gets added under the Data Service connector type.

• The configurable connection-specific fields display on the right side of the page as explained below:

  • Name: Name the connection.

  • Data Connectors: Select a data source from the drop-down menu.

  • Data Services: Select a data service from the drop-down menu.

  • Load at Start: Enable this option to get up-to-date data / pull the updated data from the data source before loading it into charts.

  • Timely Refresh: Enable this option to get the refreshed data.

  • Refresh Interval: Set the time for refresh interval. (This field appears when the Timely Refresh the field has been enabled.)

  • The Field Set tab displays all the fields after establishing the data connection.

The Export to Local Disk option exports the selected dashboard to the local disk.

• Select a dashboard using the Manage option.

• Choose the Export to Local Disk option from the More Actions context menu.

• The selected dashboard gets exported to the local disk.

• Click the Data Connectors icon to display all the available data sources.

• Click the Create New Connection icon provided next to the Excel option.

• A new connection gets added under the Excel connection type.

• The connection-specific details get displayed on the right side of the page.

• Configure the following information:

• Name: Name the connection.

• Browse: Click the Browse icon to browse an Excel file.

• Sheet Name: Select a specific sheet using the drop-down menu.

• Load at Start: Enable this option to get the updated data from the data source before loading it into charts.

• The Field Set tab displays all the fields after establishing the data connection.

Select the Condition tab and provide a condition to be applied as a filter on the selected data by putting checkmarks in the given boxes. E.g., The selected Conditions for the Category field is Catalog.

Merging Data Fields

• Click the Data Connectors icon.

• Create new connections using any data connector option (In this case, Excel connections are created. E.g., Connection-1, Connection-2).

• Create a connection under the Merged Data connector. (E.g., Connection-3).

• Configure the new connection created for Merged data by mapping the created Excel connections.

• Define a condition via the drop-down menu in the Criteria space. (E.g. Equal or Not Equal)

• Click the Create Criteria icon.

• The Merged Fields displays all the data fields from the merged connections.

• After clicking the Create Criteria icon, the created criteria get added to space.

• Trigger a script to produce some action on the connection part using the Script on Load icon.

Removing fields from the Merged Data Connection

Creating a Calculated Field

Select the Calculated Fields tab to access Calculated Field Editor and add the calculated fields.

• Click the Calculated Fields tab.

• Click the Add icon.

• The Calculated Field Editor window opens.

• Provide a title for the calculated field.

• Insert calculation formula inside the Script Editor space.

• Click the Create option.

• The newly created Calculated field gets added under the Calculated Fields tab.

• Click the Data Connectors icon.

• Click the Create New Connection icon provided next to the WebSocket connector.

• A new connection gets created under the Web Socket connector type.

• The configurable connection-specific fields display on the right side of the page as explained below:

  • Name: Provide a name for the connection

  • URL: Enter a URL link

  • guid: Provide the guid.

  • Ingestion ID: Provide the ingestion id.

  • Ingestion Secret: Provide the ingestion secret key.

  • Load at Start: Enable this option to get up-to-date data / pull the updated data from the data source before loading it into charts.
• The WebSocket connection gets established.

• Click the Data Connectors icon to display all the available data sources.

• Click the Create New Connection icon provided next to the Data Sheet connector.

• A new connection gets created under the Data Sheet connector type.

• The configurable connection-specific fields display on the right side of the page as explained below:

  • Name: Provide a name for the connection.

  • Data Sheet: Select a Data Sheet from the drop-down menu.

  • Load at Start: Enable this option to get up-to-date data / pull the updated data from the data source before loading it into charts.

  • Timely Refresh: Enable this option to get the refreshed data.

  • Refresh Interval: Set the time for refresh interval. (This field will appear only when the Timely Refreshed field has been enabled.)

• The Field Set tab displays all the fields after establishing the data connection.

• Click the Data Connectors icon to display all the available data sources.

• Click the Create New Connection icon provided next to the Data Store connector.

• A new connection gets created under the Data Store connector type.

• The configurable connection-specific fields display on the right side of the page as explained below:

  • Name: Provide a name for the connection.

  • Data Store: Select a datastore from the drop-down menu.

  • Load at Start: Enable this option to get up-to-date data / pull the updated data from the data source before loading it into charts.

  • Timely Refresh: Enable this option to get the refreshed data.

  • Refresh Interval: Set the time for refresh interval. (This field will appear only when the Timely Refreshed field has been enabled.)

• The Field Set tab displays all the fields after establishing the data connection.

​

An area chart or area graph displays graphically quantitively data. It is based on the line chart. The primary use of area charts is to display trends over a period of time.

Best Situation to use an Area Chart

• To view the automobile sales of a manufacturer over a period of time.

• To view the revenue growth of an organization by quarter wise.

Default Visualization of the Chart

Properties of the Area Chart

General

In the General properties of the Area Chart, users can customize several aspects:

• Component Name: Assign a unique identifier to the chart for easy reference. This field contains an auto-generated name indicating the sequence of the component in the dashboard.

• Left & Top: Set the chart's position within the design area by modifying these values.

• Height & Width: Adjust the chart's dimensions to fit your layout needs.

• Initial Visibility: Enable to ensure the chart appears during the initial preview.

• Max Button: Provide a button to maximize the chart for better visibility.

• Color From Drill: Utilize colors from drilled data points to enhance visual distinction.

• Points: Display data points on the chart for greater detail.

• Line Form: Select the form of the line in the chart, such as Segment or Curve.

• Chart Type: Choose the chart's style, e.g., Overlaid, Stacked, and Laid to best represent the data.

Background

In the Background properties of the Area Chart, users can enhance the visual appeal by adjusting the following fields:

• Gradient Rotation: Modify the angle of the gradient to achieve the desired effect.

• Opacity: Set the transparency level to balance visibility and aesthetics.

• Gradient: Choose and customize the gradient colors to match your theme.

  • Click the Gradient icon to access the Background gradient colors dialog box.

  • Click the Add Color option to add multiple colors.

  • Click the Save option to apply the selected background colors.
• Border: Add a border around the chart for a defined perimeter.

• Border Color: Alter the border color to complement or contrast with the chart.

• Border Radius: Round the corners of the chart border for a smoother look.

• Shadow: Enable shadows to create depth and a 3D-like effect.

• Shadow Color: Customize the shadow color to blend naturally with the chart.

• Shadow Transparency: Adjust the transparency level to control the intensity of the shadow effect.

Tooltip

Tooltips enhance user interaction by displaying additional information about chart elements.

• Show Tool Tip: Enable this option to display tooltips for the chart series, providing descriptions or data insights.

  • Click the Show Tool Tip icon to access the Tool Tip Configuration window.

  • Select the Default option.

  • Put a checkmark in the box to enable the component formatter.
• Background Color: Choose a background color for the tooltip to enhance visibility and match your visual theme.

• Opacity: Adjust the tooltip's transparency to ensure it doesn't obstruct important chart elements while remaining readable.

• Border Color: Select a border color that complements the tooltip, ensuring clarity and contrast against the chart background.

• Tooltip Font Size: Customize the font size to maintain readability, adapting it to the overall chart presentation.

• Box Width: Define the width of the tooltip box to ensure it fits the content appropriately and maintains a neat appearance.

• Precision: Set the numerical precision for data values displayed in the tooltip, aiding in clearer data interpretation.

• Highlighter: Toggle the highlighter to emphasize specific data points on the chart, drawing user attention to crucial information.

Title

• Title Box Color: Choose the background color for the title box.

• Show Title Box: Enable or disable the display of the title box on the chart.

• Show Title: Enable or disable the display of the title text.

• Title Bar Height: Set the height of the title bar.

• Description: Add a description text below the title.

• Font Color: Select the color of the title text.

• Font Size: Specify the size of the title text.

• Font Style: Choose a Font style using the drop-down menu (e.g., italic or normal).

• Font Weight: Set the weight (boldness) of the font. The supported options are Normal, Bold, 300, 600, and 900.

• Font Family: Choose the font family for the title text from the given choices.

• Align: Align the title text (e.g., left, center, right).

• Text Decoration: Apply text decorations (e.g., underline) to the title text.

• Show Dataset Description: Enable or disable the dataset description in the title.

Subtitle