Table of Contents | ||||
---|---|---|---|---|
|
Dashboards
A new mobile-friendly management tool that visually displays information based on what components are used.
Enable finDashboard extension
In order to use this functionality, finDashboard
extension must be enabled
Follow the steps below to enable the extension:
Select the App Launcher icon on the top left
Select the Setting tile under Advanced Apps
This will open a drawer with the following options: Ext, Proj, Header, and Alarm
Select the Ext option to open up the extensions
This will open a side menu on the right where the extension will be in alphabetical order
Scroll down and find the following extension:
finDashboard
If the version number is green, this means that the extension is enabled
If the version number is red, this means that the extension is disabled
Select on the extension if it is disabled, this will open a drawer
Select on the Enable option
Refresh the page
Creating a new Dashboard
1. Select the Dashboards tile which is under End User apps
2. Once selected, a drawer will open that contains any existing dashboards
If there are none, then it will display No Data
3. Select the icon to create a new dashboard
4. The form Add Dashboard will open
Title: Name for the dashboard
dashboardOn: Determines where the dashboard will run on
Layout: Choose how the widgets will be organized
(Optional) Cloud Dashboard: It adds a tag to the record that allows it to be viewed in the cloud
If the layout is incorrect after creating the dashboard, it can be changed by resizing the widget if needed.
5. After selected Save, the layout will be created
Edit
1. Select the edit icon
2. A popup called Edit Dashboard will appear where the title and dashboardOn can be edited
3. Select Save to save the changes
Delete
1. Select the delete icon
2. A popover will appear where it will confirm if the correct dashboard is being deleted
3. Select Yes to complete the delete action
Widget
Widgets provide quick access to information without requiring to open the app that manages the information
API: Widget
Edit
Widget Title
Name of the widget, this can be optional
Edit View
Edit mode will always show the widget title bar with the three dots to edit/duplicate/delete even if there is no widget title
View Mode
Doesn’t display the widget title bar if there is no title in the view mode
History Chart
This would display the historical data of selected points on a chart.
API: History Chart
History Chart Points and Range
Note: History charts update on an hourly interval
Allow the ability for users to select what the default historical range that should be displayed
Today
/yesterday
is 1hthisweek
/lastWeek
is 1daythisMonth
/lastMonth
is 1weekthisYear
/lastYear
is 1month
Choose the color per point added to chart
Then select the point data type they would like to add on the chart
Line
Rotate | If checked will rotate chart |
Filled | If checked will fill the chart underneath |
Legend | If checked will show a legend under the chart |
Download Button | If checked will show button allowing user to download the chart |
Bar
Rotate | If checked will rotate chart |
Legend | If checked will show a legend under the chart |
Download Button | If checked will show button allowing user to download the chart |
Comparison
Rotate | If checked will rotate chart |
Legend | If checked will show a legend under the chart |
Download Button | If checked will show button allowing user to download the chart |
Stacked
Rotate | If checked will rotate chart |
Legend | If checked will show a legend under the chart |
Download Button | If checked will show button allowing user to download the chart |
3D
Rotate | If checked will rotate chart |
Legend | If checked will show a legend under the chart |
Download Button | If checked will show button allowing user to download the chart |
Rotate | If checked will rotate chart |
3D | If checked will display 3D |
Download Button | If checked will show button allowing user to download the chart |
Cylinder
Download Button | If checked will show button allowing user to download the chart |
Pie
3D | If checked will display 3D |
Download Button | If checked will show button allowing user to download the chart |
Gauge
Download Button | If checked will show button allowing user to download the chart |
Value
API: Value
Weather
Displays the selected weather data
API: Weather
Table
Display information in a grid-like format of rows and columns.
API: Table
Examples
| |
| KeepCols the user specifies which columns they want to show and rest are hidden |
| AddColMeta the user specifies which columns they want to hide and the rest are shown |
Map
It displays the coordinates of a site or any records that have coordinates. The map widget will only be available if the user has a valid access token. Doc on how to add the access token is found /wiki/spaces/FINFrameworkV106/pages/3952214017: Map - Access Token Setup.
API: Map
For the coordinates to get displayed, the site or record must have a geoCoord tag that contain the latitude and longitude values. Example query to use in the Map query field could be readAll(geoCoord)
or site
etc.
Adding a geoCoord tag to a site
Select the App Launcher icon on the top left
Select the DB Builder tile under System Integrator Apps
Select the Equip Tree, this will expand a drop-down menu to see the sites associated with your project
Select on a site, this will open a Essentials tab that will contain information regarding the site
Fill in both the latitude and longitude property fields.
A way to get the latitude and longitude values is via Google Maps.
First, find the location you want to get the coordinates from.
Then right click on the pin in Google Maps to find the latitude and longitude values.
Click on the latitude and longitude to copy to clipboard.
Paste on a notepad.
Then copy each value and paste in the respective latitude and longitude field.
Once filled in, select the Save button on the bottom right. The site now has a geoCoord tag with the latitude and longitude values and will be visible on the Map widget.
Dynamic Color Pins
On the geoCoord record, the user can add a string tag called “color” with the value being the color they want. The value can be the name of the color or hex value of the color. This would allow each geoCoord have their own unique colors if needed.
There are various websites to get the hex color codes, below are a few:
Duplicate
1. Hover over the 3 dots to pop open a menu
2. Click on the Duplicate option to duplicate the widget
This will duplicate the selected widget, and will appear at the bottom. If a point has been assigned prior to duplicating the widget, the point will also be included.
Delete
1. Hover over the 3 dots to pop open a menu
2. Click on the Delete option to delete the widget