Versions Compared

Old Version 1

changes.mady.by.user Kimberly Cruz

Saved on

compared with

New Version Current

changes.mady.by.user Ricky Villa

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Table of Contents
minLevel1
maxLevel7

Dashboards

A new mobile-friendly management tool that visually displays information based on what components are used.

Image Added

Image Added

Enable finDashboard extension

In order to use this functionality, finDashboard extension must be enabled

Follow the steps below to enable the extension:

  1. Select the App Launcher icon on the top left

  2. Select the Setting tile under Advanced Apps

    • This will open a drawer with the following options: Ext, Proj, Header, and Alarm

  3. 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

  4. 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

  5. Select on the extension if it is disabled, this will open a drawer

  6. Select on the Enable option

  7. Refresh the page

Creating a new Dashboard

1. Select the Dashboards tile which is under End User apps

Image Added

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 (plus) icon to create a new dashboard

Image Added

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.

Image Added

5. After selected Save, the layout will be created

Image Added

Edit

1. Select the edit icon

Image Added

2. A popup called Edit Dashboard will appear where the title and dashboardOn can be edited

3. Select Save to save the changes

Image Added

Delete

1. Select the delete icon

Image Added

2. A popover will appear where it will confirm if the correct dashboard is being deleted

3. Select Yes to complete the delete action

Image Added

Widget

Widgets provide quick access to information without requiring to open the app that manages the information

API: Widget

Image Added

Edit

Widget Title

Name of the widget, this can be optional

Image Added

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

Image Added

View Mode

Doesn’t display the widget title bar if there is no title in the view mode

Image Added

History Chart

This would display the historical data of selected points on a chart.

API: History Chart

Image Added
Image Added

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 1h

    • thisweek/ lastWeek is 1day

    • thisMonth/ lastMonth is 1week

    • thisYear/ 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

Image Added

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

Image Added

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

Image Added

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

Image Added

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

Image Added

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

Image Added

Value Chart

API: Value Chart

Image Added

Bar

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

Image Added

Cylinder

Download Button

If checked will show button allowing user to download the chart

Image Added

Pie

3D

If checked will display 3D

Download Button

If checked will show button allowing user to download the chart

Image Added

Gauge

Download Button

If checked will show button allowing user to download the chart

Image Added

Value Gauge

Used to visualize a value for a point

API: Value Gauge

Image Added
Image Added

Value

API: Value

Image Added

Image Added

Graphic

Displays the selected graphic

API: Graphics

Image Added

Image Added

Weather

Displays the selected weather data. The drop-down list of weather data to choose from is populated by the added weather in the Weather app.

API: Weather

Image Added

Image Added

Table

Display information in a grid-like format of rows and columns.

API: Table

Image Added

Examples

readAll(site)

Image Added

readAll(site).keepCols(["id","area","dis"])

KeepCols the user specifies which columns they want to show and rest are hidden

Image Added

readAll(site).addColMeta("highlights", {hidden}).addColMeta("drEvent", {hidd

 AddColMeta the user specifies which columns they want to hide and the rest are shown

Image Added

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: 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

  1. Select the App Launcher icon on the top left

  2. Select the DB Builder tile under System Integrator Apps

  3. Select the Equip Tree, this will expand a drop-down menu to see the sites associated with your project

  4. Select on a site, this will open a Essentials tab that will contain information regarding the site

  5. Fill in both the latitude and longitude property fields.

    1. A way to get the latitude and longitude values is via Google Maps.

    2. First, find the location you want to get the coordinates from.

    3. Then right click on the pin in Google Maps to find the latitude and longitude values.

      Image Added

    4. Click on the latitude and longitude to copy to clipboard.

    5. Paste on a notepad.

    6. Then copy each value and paste in the respective latitude and longitude field.

  6. 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:

Image Added
Image Added

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.

Image Added

Delete

1. Hover over the 3 dots to pop open a menu

2. Click on the Delete option to delete the widget

Image Added