Overview

Skill Level: Beginner

Beginner

With Boards & Cards in the Watson Internet of Things platform, you can now build your own Custom Dashboard. Cards depict and display vital statistics of interest with varied visualization options. Board(s) provide you with choice of landing page and group

Ingredients

Watson IoT organization

Step-by-step

  1. Introduction

    With the new boards and cards in the Watson Internet of Things platform, you can build your own Custom Dashboard. You can use the boards as the landing page of interest and then make use of the cards within them, to:

    1. Create visualization charts for the real time data from your devices
    2. Create Gauges for visualizing physical quantities like Vehicle Speed, Temperature, pressure.
    3. Create Donuts charts, bar charts to display the current value of the data points
    4. See the Data and storage consumption of your devices
    5. List of registered devices
  2. Overview to Boards & Cards

    Boards page is the default landing page, when you log into Watson IoT Platform Dashboard. Each Board can host ‘n‘ number of Cards and each Card has to belong to one or the other Board. Cards depict and display vital statistics of interest with varied visualization options.

    Just in case, you have navigated to other tabs of interest and willing to get back to the default view or back to the Boards page, then, click on the BOARDS, as available on the left hand side menu, as shown in the following Image:

    Boards_Menu

    The default landing page BOARDS, displays three default Boards, that are already made available, as shown in the following Image:

    • RULE-CENTRIC ANALYTICS       – Rule-centric default board to show analytics information
    • USAGE OVERVIEW                    – Default board to show usage statistics
    • DEVICE-CENTRIC ANALYTICS   – Device-centric default board to show analytics information

    Default_Boards

    You can either plan to customize them and use them, as-is or create a whole new Board for yourself.

    To customize an existing Board, hover the mouse over the Board of choice and click on the Settings icon.

    Board_Settings

    In the Information tab, plan to update the Board Name and it’s Description. Choice to make this Board as your landing page and have this Board as part of your Favorite, are made available here.

    Settings-Customization

    The Members tab allows you to add Users with varied privileges to access the Board. In addition to you, now add Users with privileges of Administrator, Analyst, Developer, Operator and Reader, to access the Board.

    Note: The Members need to be first added in the Members page, as available on the left hand side menu, using the + Add Members option.

    Settings-Members

    To create a new Board, in addition to the existing ones, use the +Create New Board option, as available on the top right corner of the BOARDS page:

    New_Boardspg

    Update the Information and Members tab, as depicted in the Images mentioned above and complete the process of adding a new Board to your Watson IoT Platform Dashboard.

     

  3. Realtime Data Visualization

    1. Click on any default BOARD to work with the CARDS. In the scope of this section, let us click on the Usage Overview Board and work on the Visualization aspect of data
    2. Now, Click on + Add New Card, to add a new Card of choice
    3. Under the Devices section, select Line Graph Chart, to display time series information of events

      Real-time-Line-Graph

    4. Select a device.
    5. Now, define the data set for the visualization. Click Connect new data set.
      1. Enter the name for your data set.
      2. Select the event. (Tip: If the device is publishing events, it will be populated in the dropdown)
      3. Select the property of the event. (Tip: If the device is publishing events, it will be populated in the dropdown)
      4. Optionally, you can select the unit of the data set as well.
      5. Repeat this steps to add other properties.
      6. You can reorder the datapoints by dragging the data points and dropping them. This will influence the order of visualization

        Create_Line_Graph_Card

    6. Click Next
    7. Preview the card. You can select the size of the card now. By default Small is selected.
    8. In the settings tab, you can change the settings for the visualization.
      1. You can edit the window size of the events
      2. Retention time for the data

        Create_Line_Graph_Card_Settings

    9. Click on Next to update Card Information. Provide appropriate Title to the Card, a Description to it and finally choose a color of choice for the Card

      Card-Information-Properties

    10. Click Submit.

     

     

    You can configure multiple data points to get visualization chart for all the values.

     

    Now you have successfully created the real time visualization for the devices in Watson Internet of Things platform. In the next step, you will learn how to create Gauges.

  4. Gauges

    1. In the overview tab in the Dashboard, Click + Add New Card.
    2. In the Devices section, select Gauge.
    3. Select a device.
    4. Now, define the data set for the visualization. Click Connect new data set.
      1. Enter the name for your data set.
      2. Select the event. (Tip: If the device is publishing events, it will be populated in the dropdown)
      3. Select the property of the event. (Tip: If the device is publishing events, it will be populated in the dropdown)
      4. Optionally, you can select the unit of the data set as well.
    5. Click Next
    6. Preview the card. You can select the size of the card now. By default Small is selected. Select Large.
    7. You can also edit the settings of the gauge visualization at the settings tab.
      1. You can edit the lower, Middle and Upper threshold settings for the Gauge widget.
    8. Enter the title for the card and click Submit.

     

    Now you have successfully created the Gauges for the physical quantities in your devices in Watson Internet of Things platform.

    Similarly, you can create bar graphs, donut chart for the events published from the devices.

    Below is the dashboard created for data published from a car

     

     

  5. Usage Statistics Cards

    This cards can be used to build Dashboards to get the data regarding the devices connected, Data Usage and Storage Data.

    1. In the Usage Overview Board, Click + Add New Card.
    2. In the Usage section.
    3. Select Device Types
      1. This gives information of all the devices registered in Watson IoT.
      2. Select the Size of the card
      3. Give a suitable title to the card.
    4. Select Data Transferred.
      1. This gives information on the amount of data transferred, as of today.
      2. Select XXL size.
      3. Give a suitable title to the card.
    5. Select Data Consumption.
      1. This gives information about the Data traffic
      2. Select XXL size
    6. Select Storage Consumption.
      1. This gives information about the Storage consumption in the platform
      2. Select XXL size

    Below is the screenshot with all the 4 usage cards added in the dashboard.

  6. Conclusion

    So in this tutorial, you have learnt to create the Boards and Cards in the Watson IoT platform to build custom dashboards for your IoT solutions. As a next step go through following recipes to help build an end to end IoT solution,

    For any Feedback/Questions, please feel free to comment below

11 comments on"Configuring Boards & Cards in the new Watson IoT Dashboard"

  1. DarthNEvadeher April 06, 2016

    Hi, I cannot find the, ‘Add A new card’ option in my dashboard. Can someone please help?

  2. Amit M Mangalvedkar April 06, 2016

    This functionality is provided as a beta feature, so you need to turn on the experimental features. Click on Settings -> and under General, select the experimental features.
    Thanks and Regards
    Amit M Mangalvedkar

  3. DarthNEvadeher April 06, 2016

    I am trying to get a visualization of the data from my mbed iot device. I have followed all of the steps mentioned above. But when I add the card, no data is being passed in. What I mean is that the real time chart displays no data.

  4. Jeffrey Dare April 07, 2016

    Hey @DarthNEvadeher,
    Were you able to see the list of properties from the drop down menu when configuring the visualization? This will ensure that the property names are populated correctly. So this will also ensure that the system is able to receive the events.

    If you manually entered the property name, can please recheck the property name as it is case insensitive?

  5. DarthNEvadeher April 07, 2016

    Hey @JeffreyDare
    I have managed to do it. I did not configure it properly and thus it did not work.
    Thank you very much, for your advice. I can create a real time card.

  6. i like! so much quicker and easier than faffing about with RTI.
    once we have a dashboard built, though, how does one embed that in a external application? customer portal, mobile app, etc

  7. Dennis.Lopes August 15, 2016

    Hello,

    I tried to use Real Time chart card, but it’s not working as expected. Curiously I was able to use the card Device Properties to see all the properties being transmitted by my TI Sensor Tag, but when I select the same parameters to be shown in the Real Time card, nothing is plotted. Sounds like a problem in this card.

  8. AndrewCrisp March 06, 2017

    Hi,

    Do you know of a way to display text data in the dashboard, for informational purposes? The cards seem to be limited directly to what is coming in through the platform.

  9. Hi,

    How can I change the decimal places? I only can see my data with 1 decimal place.

    Thanks

    • Recipes@WatsonIoT May 08, 2017

      Hello Roriz,
      1. In the Device Card of choice, click on the SETTINGS and choose the Data Source of interest under the ‘Card Source Data’ entry.
      2. Now, in the ‘Type’ entry, you would have chosen FLOAT as your data type. Under the TYPE option, you should now be able to see PRECISION option, whose entry is defaulted to 1 ( single precision ). Modify the value to your interest, say 2 or 3 to extend the precision to 2 or 3 decimal places.
      3. Click on Next to continue and Save the settings

  10. Hi,

    I follow this receipe end all work fine, but I’m able to add only one card for board. What is the solution for this problem?

Join The Discussion