Creating a Dashboard
- Former user (Deleted)
Follow the steps below to create the dashboard:
- Sign into the Portal. The WSO2 Dashboard Designer home page appears with the dashboards that are available for the respective user.
- Click Create Dashboard to navigate to the dashboard creation page.
- Enter the dashboard related details and click Next.
- Name of your Dashboard - The name given to identify the dashboard.
- URL - The URL that is used to access the dashboard. The URL should be unique for each dashboard.
- Description - A summarized description on the dashboard.
If you wish to create a dashboard with a banner, follow the instructions below and skip step 5.
Click here for instructions...Follow the instructions below to add a banner to a dashboard:
You can only add a banner to a dashboard when you are in the process of creating a dashboard, or when you are adding a new page to a dashboard.
Click on the Balanced Grid With Banner layout.
Only the "Balanced Grid With Banner" layout allows you to add a banner to the dashboard page being created.
The following page appears enabling you to add a banner to the dashboard.
- Click Add, select an image from the file browser window, and click Open.
The selected image appears in the block allocated for the banner with the option to crop the image.
- Crop the banner image.
- If required, zoom the image using the wheel button or the touchpad.
- Move your pointer over the cropping tool and drag the points to resize it.
- Click Save to crop the image.
When designing a dashboard, you can not resize a banner after you have cropped and saved it. If you wish to edit the banner after it is saved, click Edit and repeat steps 2 and 3 above.
If you wish to create a dashboard without a banner, follow the steps below:
Click on a preferred page layout.
As shown in the above screenshot, WSO2 DS provides six layouts to choose from.
This directs you to the dashboard edit page, which provides you a host of options to add gadgets to the dashboard being created.
Customize the dashboard as required.
Click here for instructions...WSO2 Dashboard Server (WSO2 DS) allows you to create custom dashboard layouts by adding new blocks, resizing, moving them across the dashboard, and much more. The following are the ways in which an editor can edit a dashboard:
- Adding a block to a dashboard
- Adding a gadget to a dashboard
- Repositioning a block in the dashboard
- Resizing a block in the dashboard
- Maximizing and minimizing the view of a gadget
- Updating page properties
- Changing user preferences of a gadget
- Removing a block in a dashboard
- Removing a page in a dashboard
Adding a block to a dashboard
- If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click Design to edit the design of a dashboard.
- Click Add Block.
- If you want to view the size of the existing blocks in the dashboard, click Show Grid. This displays a grid to gauge the size of the block based on its columns.
- Enter the width and height of the block in the respective text-boxes, or drag the pointer either vertically, horizontally or diagonally to define the size of the block in the grid.
- Click Add Block to add the block to the page in the dashboard.
Adding a gadget to a dashboard
- If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click Design to edit the design of a dashboard.
- Click on Gadgets. All the available gadgets (i.e., shipped with WSO2 DS and the customized gadgets) appears.
Drag and drop the gadget into the desired block in the dashboard.
The visual content of some gadgets (e.g., The "Population by History" gadget, which is part of the drilldown Dashboard sample) only appear after you have enabled gadget to gadget communication.
Repositioning a block in the dashboard
- If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click Design to edit the design of a dashboard.
- Hover your pointer over the block title bar, drag the pointer, and release the pointer in a preferred location in the dashboard.
Resizing a block in the dashboard
- If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click Design to edit the design of a dashboard.
- Hover your pointer over the bottom-right corner of the block. When the resize button appears together with the diagonal pointer, drag the pointer to resize the dashboard.
Maximizing and minimizing the view of a gadget
- If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click Design to navigate to the dashboard design mode or click View to navigate to the dashboard view mode.
- If you want to view a gadget in a dashboard in full screen, click on the Maximize button.
The gadget appears in full screen as shown below.
To revert to the standard view of the gadget, click on the Minimize button.
Updating page properties
When creating a dashboard, WSO2 DS automatically creates a default page named Home. Update the properties related to a page as follows:
- If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click Design to edit the design of a dashboard.
- Click Pages.
- Click on the respective page name.
- Edit the page related properties as required.
- Title - Name of the page. When a new page is created, by default it is given a generic name (e.g., Page 0, Page 1, etc.). Replace the generic page name with a meaningful name.
- URL - This is the URL context that is used to access this specific page in the dashboard.
Format:http://<DS_HTTP_HOST>:<HTTP_PORT>/portal/dashboards/<DASHBOARD_NAME_URL_CONTEXT>/<PAGE_NAME_URL_CONTEXT>
https://<DS_HTTPS_HOST>:<HTTPS_PORT>/portal/dashboards/<DASHBOARD_NAME_URL_CONTEXT>/<PAGE_NAME_URL_CONTEXT>
Example:https://localhost:9443/portal/dashboards/sales-stats/sales-targets
- Use as Landing - Select this option if you want this page to be the very first page that appears when a user accesses the dashboard.
- Make Anonymous - Select this option if you want anonymous users to access this page without having to log into the WSO2 Dashboard Server.
- Full Width - Select this option if you want the page to be displayed in full screen mode without any margins.
Changing user preferences of a gadget
When a dashboard editor changes the userPreferences in the dashboard view page, the changes are saved in the original registry space of the dashboard.
If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click View to view the dashboard.
Click Properties.
The properties button only appears if user preferences are defined, using the
<UserPref>
tags, in the gadget definition XML file.- Enter the required user preference properties.
You can use the user preference properties, which vary from gadget to gadget, to customize the gadget.
For example, when using a text-box gadget, you can customize the wording that appears within the text-box. - Click Properties.
The changes are saved to the userPrefs of that particular gadget. In addition, the gadget view is also updated based the new preferences.
Removing a block in a dashboard
- If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click Design to edit the design of the respective dashboard.
- Click Remove, which appears in the block title bar.
- Select your delete preference and click Delete.
- The following message-box appears when you are trying to delete a block that already has a gadget.
- The following message-box appears when you are trying to delete an empty block.
- The following message-box appears when you are trying to delete a block that already has a gadget.
Removing a page in a dashboard
- If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click Design to edit the design of the respective dashboard.
- Click Next and Previous to navigate to the required page.
- Click Remove.
- Click Yes to confirm the deletion process.
Optionally, add a page.
Click here for instructions...WSO2 DS allows editors to create dashboards with multiple pages, which have separate dashboards in each of the pages. The latter mentioned feature in WSO2 DS enables users to group multiple dashboards together, and also to maintain multiple views of a single dashboard.
Follow the instructions below to add a page to a dashboard:
- If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click Design to edit the design of a dashboard.
- Click Pages.
- Click Create Page.
- Click on a preferred layout.
- Click on the newly created page to view the related properties.
Edit the page related properties as required.
- Title - Name of the page. When a new page is created, by default it is given a generic name (e.g., Page 0, Page 1, etc.). Replace the generic page name with a meaningful name.
- URL - This is the URL context that is used to access this specific page in the dashboard.
Format:http://<DS_HTTP_HOST>:<HTTP_PORT>/portal/dashboards/<DASHBOARD_NAME_URL_CONTEXT>/<PAGE_NAME_URL_CONTEXT>
https://<DS_HTTPS_HOST>:<HTTPS_PORT>/portal/dashboards/<DASHBOARD_NAME_URL_CONTEXT>/<PAGE_NAME_URL_CONTEXT>
Example:https://localhost:9443/portal/dashboards/sales-stats/sales-targets
- Use as Landing - Select this option if you want this page to be the very first page that appears when a user accesses the dashboard.
- Make Anonymous - Select this option if you want anonymous users to access this page without having to log into the WSO2 Dashboard Server.
- Full Width - Select this option if you want the page to be displayed in full screen mode without any margins.
Edit the dashboard in the newly added page as required.
Click here for instructions...WSO2 Dashboard Server (WSO2 DS) allows you to create custom dashboard layouts by adding new blocks, resizing, moving them across the dashboard, and much more. The following are the ways in which an editor can edit a dashboard:
- Adding a block to a dashboard
- Adding a gadget to a dashboard
- Repositioning a block in the dashboard
- Resizing a block in the dashboard
- Maximizing and minimizing the view of a gadget
- Updating page properties
- Changing user preferences of a gadget
- Removing a block in a dashboard
- Removing a page in a dashboard
Adding a block to a dashboard
- If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click Design to edit the design of a dashboard.
- Click Add Block.
- If you want to view the size of the existing blocks in the dashboard, click Show Grid. This displays a grid to gauge the size of the block based on its columns.
- Enter the width and height of the block in the respective text-boxes, or drag the pointer either vertically, horizontally or diagonally to define the size of the block in the grid.
- Click Add Block to add the block to the page in the dashboard.
Adding a gadget to a dashboard
- If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click Design to edit the design of a dashboard.
- Click on Gadgets. All the available gadgets (i.e., shipped with WSO2 DS and the customized gadgets) appears.
Drag and drop the gadget into the desired block in the dashboard.
The visual content of some gadgets (e.g., The "Population by History" gadget, which is part of the drilldown Dashboard sample) only appear after you have enabled gadget to gadget communication.
Repositioning a block in the dashboard
- If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click Design to edit the design of a dashboard.
- Hover your pointer over the block title bar, drag the pointer, and release the pointer in a preferred location in the dashboard.
Resizing a block in the dashboard
- If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click Design to edit the design of a dashboard.
- Hover your pointer over the bottom-right corner of the block. When the resize button appears together with the diagonal pointer, drag the pointer to resize the dashboard.
Maximizing and minimizing the view of a gadget
- If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click Design to navigate to the dashboard design mode or click View to navigate to the dashboard view mode.
- If you want to view a gadget in a dashboard in full screen, click on the Maximize button.
The gadget appears in full screen as shown below.
To revert to the standard view of the gadget, click on the Minimize button.
Updating page properties
When creating a dashboard, WSO2 DS automatically creates a default page named Home. Update the properties related to a page as follows:
- If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click Design to edit the design of a dashboard.
- Click Pages.
- Click on the respective page name.
- Edit the page related properties as required.Unable to render excerpt. Already included page Adding a Page in a Dashboard.
Changing user preferences of a gadget
When a dashboard editor changes the userPreferences in the dashboard view page, the changes are saved in the original registry space of the dashboard.
If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click View to view the dashboard.
Click Properties.
The properties button only appears if user preferences are defined, using the
<UserPref>
tags, in the gadget definition XML file.- Enter the required user preference properties.
You can use the user preference properties, which vary from gadget to gadget, to customize the gadget.
For example, when using a text-box gadget, you can customize the wording that appears within the text-box. - Click Properties.
The changes are saved to the userPrefs of that particular gadget. In addition, the gadget view is also updated based the new preferences.
Removing a block in a dashboard
- If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click Design to edit the design of the respective dashboard.
- Click Remove, which appears in the block title bar.
- Select your delete preference and click Delete.
- The following message-box appears when you are trying to delete a block that already has a gadget.
- The following message-box appears when you are trying to delete an empty block.
- The following message-box appears when you are trying to delete a block that already has a gadget.
Removing a page in a dashboard
- If you are not in the process of creating a dashboard, navigate to the Dashboard Designer home page, and click Design to edit the design of the respective dashboard.
- Click Next and Previous to navigate to the required page.
- Click Remove.
- Click Yes to confirm the deletion process.
When a dashboard with multiple pages are accessed via the dashboard viewer (view mode), these pages are rendered as tabs inside the dashboard, and you can switch between the pages by clicking on the respective tabs.
Optionally, enable inter-gadget communication.
Click here for instructions...Follow the instructions below to enable inter-gadget communication, so that the subscriber (listener) can subscribe (listen) to a publisher channel:
The following steps are only applicable for gadgets that are designed for inter-gadget communication. For more information, see Configuring Gadgets for Inter-gadget Communication.
- If you are not in the process of creating a dashboard, navigate to the WSO2 Dashboard Designer home page, and click Design to edit the design of a dashboard.
Add the publisher and subscriber gadgets into the dashboard if you have not done so already.
If you wish you can add customized publisher and subscriber gadgets or you add the publisher and subscriber gadgets that are shipped with WSO2 DS.- Click Gadget Configurations in the block that has the subscriber gadget.
The corresponding gadget configurations menu appears in the right-hand side panel. The name of the listener appears under the caption Events.
Click Events, and then click on the name of the listener, in this case it is subscriber.
All the publisher channels that correspond to the subscriber, which are based on the subscriber type, appears.Select the publisher channel.
Now, the subscriber gadget is configured to listen to the selected publisher channels.
Optionally, enable dashboard security.
If a dashboard is not secured, all users are allowed to access and edit the dashboard.
Click here for instructions...Follow the steps below to secure the dashboard:
- If you are not in the process of creating a dashboard, sign into the portal.
Click Settings from on of the following locations.
- If you are in the process of creating a dashboard, click Settings from the dashboard design mode.
- If you are in the Dashboard Designer home page, click the Settings button that corresponds to the dashboard for which you want to enable security.
- If you are in the process of creating a dashboard, click Settings from the dashboard design mode.
Update the dashboard security settings as follows:
Permissions - Select user roles for the viewer and editor access to this dashboard, and remove the other user roles.
The editor can only select from user roles that have been already created by the administrator. For more information, see Adding a User Role and Adding a New User and Assigning Roles.
When the default user roles (e.g., Internal/Everyone) are deleted, the existing user's admin privileges get revoked. Therefore, before removing the existing user roles (e.g., Internal/Everyone) of a dashboard, ensure to first save the new user roles.
OAuth Settings
The gadgets used in WSO2 DS may have to communicate with third-party APIs to retrieve information. If required, you can enable OAuth to secure such communication as follows:Click on the Enable option to enable OAuth. This displays the Identity Server URL.
Click on the refresh button, to register the dashboard for OAuth purposes. This registration process is automated in WSO2 DS; therefore, if the dashboard registration process is successful, you will receive the API Key and API Secret, which will be displayed in the OAuth settings section.
The Access Token URL is the same for all the dashboards. However, the API Key and API Secret is unique for each dashboard. When a gadget in a specific dashboard needs to communicate with third-party APIs to retrieve information, the Identity Server, which is embedded within WSO2 DS, uses the dashboard specific API Key and API Secret to generate an OAuth token that is used for authentication purposes.