GithubHelp home page GithubHelp logo

softwareag / cumulocity-barchart-widget Goto Github PK

View Code? Open in Web Editor NEW
0.0 2.0 1.0 507 KB

Bar Chart widget is a Cumulocity IoT runtime widget. It allows you to define multiple datapoints as constant values or realtime measurements from a device or device group. It has been developed by the Software AG Global Presales team.

License: Apache License 2.0

TypeScript 70.84% JavaScript 18.39% CSS 1.90% HTML 8.86%
widget runtime cockpit cumulocity iot-analytics cumulocity-iot global-presales barchart bar-chart cumulocity-widget

cumulocity-barchart-widget's Introduction

Bar Chart Widget for Cumulocity IoT

This is a runtime bar chart widget. It allows you to define multiple datapoints as constant (fixed) values or actual measurement values in realtime from Device or Device Groups. In addition, you can add custom icon respective to each datapoint.

⚠️ This project is no longer under development. Please use cumulocity-barchart-widget-plugin for Application Builder >=2.x.x and Cumulocity >=1016.x.x⚠️

Preview

Installation - for the dashboards using Application Builder

  1. Download the latest c8y-barchart-widget-{version}.zip file from the Releases section.
  2. Make sure you have Application Builder installed.
  3. Open a dashboard.
  4. Click more....
  5. Select Install Widget and follow the instructions.

Configuration - to view the Bar Chart widget

  1. Make sure you have successfully installed the widget.
  2. Click on Add widget.
  3. Choose Bar chart widget.
  4. Title is the title of widget. Provide a relevant name. You may choose to hide this. Go to Appearance tab and choose Hidden under Widget header style.
  5. Delete datapoint allows you to delete a datapoint.
  6. Label is the name of the datapoint that will appear on the x-axis.
  7. Icon is for the icon you want to show on the top of the datapoint.
  8. Value type allows to you choose whether datapoint will have a Constant value or a Measurement value from a Device or a Device Group.
  9. Value type is Constant.
    1. Value allows you provide a fixed value (numerical) for the datapoint.
  10. Value type is Measurement.
    1. Select device/ device group allows you to choose a Device or Device Group.
    2. Select fragment series allows you to choose a Fragment and Series combined. It automatically gets populated based on the device or device group selected.
  11. Color allows you choose a color specific for the bar.
  12. Add new datapoint allows you to define additional datapoints.
  13. Click Save to add the widget on the dashboard.
  14. In case you see unexpected results on the widget, refer to browser console to see if there are error logs.

Development - to do the enhancements and testing locally

  1. Clone the repository on local machine using git clone https://github.com/SoftwareAG/cumulocity-barchart-widget.git.
  2. Run npm install to download the module dependencies.
  3. Install c8ycli npm install -g @c8y/cli if not already.
  4. Run c8ycli server -u https://your_tenant_url to start the server.
  5. Go to http://localhost:9000/apps/cockpit/ in the browser to view and test your changes.
  6. (Optional) push the changes back to this repository.

Build - to create a new build for the Runtime Widget Loader

  1. Finish the development and testing on your local machine.
  2. Run gulp to start the build process. Run npm install -g gulp to install gulp if not already.
  3. Use c8y-barchart-widget-{version}.zip file in the dist folder as a distribution.

These tools are 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 TECHcommunity Forums.

You can find additional information in the Software AG TECHcommunity.

cumulocity-barchart-widget's People

Contributors

kalpshekhar-sag avatar sandhyadeeps avatar

Watchers

 avatar  avatar

cumulocity-barchart-widget's Issues

Runtime Binary

If the effort for converting it is low, please consider converting to a plugin providing a runtime binary.

Creating a runtime binary for this widget might make it easy for users to install this as an extension package in administration and make use of it directly in cockpit application

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.