Giter Club home page Giter Club logo

cumulocity-device-chart-widget-plugin's Introduction

Cumulocity Device Chart Widget Plugin

This Device Chart Widget is the Cumulocity module federation plugin created using c8ycli. This plugin can be used in Application Builder or Cockpit. It displays the chart based on the device-specific inventory data. By Default the chart displays the count based on the input in the group by field of configuration. But if the input is provided in the value field of the widget configuration it gives the value sum of the provided field from device managed object.

The widget also comes with an inbuilt color picker, which helps one to customize chart/border colors. The charts available include

Vertical Bar Chart

Horizontal Bar Chart

Donut Chart

Pie Chart

Radar Chart

Polar Chart

Scatter Chart (Data set not ideal for this chart)

Bubble Chart (Data set not ideal for this chart)

Please choose Device Chart Widget release based on Cumulocity/Application builder version:

APPLICATION BUILDER CUMULOCITY DEVICE CHART WIDGET PLUGIN
2.0.x >= 1016.x.x 1.x.x

DeviceChart

Features

  • Support single device and group devices: Depends on Deviceid selected in widget configuration.
  • Supports Alarm Chart: It displays the Alarm chart if group by is set to c8y_ActiveAlarmsStatus in configuration.
  • Supports Firmware Chart: It displays the Firmware chart if group by is set to versionIssuesName in configuration.
  • Fetch Inner child Devices: Fetches Inventory data for chid devices only if Fetch innerchild devices is checked in configuration.
  • Support multiple charts: Based on chart type in configuration.

Prerequisite

Cumulocity c8ycli >=1016.x.x

Installation

Runtime Widget Deployment?

  • This widget support runtime deployment. Download Runtime Binary and install via Administrations --> Ecosystems --> Applications --> Packages

QuickStart

This guide will teach you how to add widget in your existing or new dashboard.

  1. Open your application from App Switcher

  2. Add new dashboard or navigate to existing dashboard

  3. Click Add Widget

  4. Search for Device Chart

  5. Select Target Assets or Devices

  6. Click Save

Congratulations! Device Chart is configured.

User Guide

  1. Target Assets/Devices - deviceid/groupid of interest

  2. Group By- provide the field name from the device managed object on which you want to group For eg:-

    • To create Alarm chart set the field to c8y_ActiveAlarmsStatus.
    • To create firmware chart set the field to versionIssuesName.
    • To create chart that displays the device type count set the field to type.
  3. Value(Optional) -provide the field name from the device managed object whose value sum you want display For eg. :-

    • If you just want to display the count for each group by type then leave it empty.
    • To display the capacity for each groupby type then set the field to capacity.
    • To display the quantity for each groupby type then set the field to quantity.
  4. Chart Type - type of chart that you want to display.

  5. Legend - position of legend you want

  6. You can toggle the slider if you want the results for child devices also

One can also select the custom chart color and Border color to beautify the chart, if not default colors will be picked.


This widget is provided as-is and without warranty or support. They do not constitute part of the Software AG product suite. Users are free to use, fork and modify them, subject to the license agreement. While Software AG welcomes contributions, we cannot guarantee to include every contribution in the master project.


For more information you can Ask a Question in the TECH Community Forums.

cumulocity-device-chart-widget-plugin's People

Contributors

sandhyadeeps avatar sheethaljr avatar

Stargazers

 avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.