Enhancing Cumulocity IoT Capabilities: Custom Information Display Widgets
Tags: cumulocity, iot, datavisualization, dataviz
Published: 2023-09-29 13:32:55

---
title: Enhancing Cumulocity IoT Capabilities: Custom Information Display Widgets
published: true
date: 2023-09-14 14:17:02 UTC
tags: cumulocity, iot, datavisualization, dataviz
canonical_url: https://tech.forums.softwareag.com/t/enhancing-cumulocity-iot-capabilities-custom-information-display-widgets/281189
---

In the world of IoT, effective data visualization is key. While Cumulocity IoT offers a range of built-in widgets, there may be instances where these are not enough for your IoT projects. This is where the custom widgets come into play. They provide personalized solutions for your data visualization requirements. In this article, we will explore seven custom widgets, specifically designed for information display, each with its unique features.

## Event Image Viewer Widget Plugin

**Author:** [@Ravi\_Shankar\_Kumar](https://tech.forums.softwareag.com/u/ravi_shankar_kumar)

The [Event Image Viewer Widget Plugin](https://github.com/SoftwareAG/cumulocity-event-image-viewer-widget-plugin) is designed to display the events that are created whenever a camera device captures an image.

{% embed https://github.com/SoftwareAG/cumulocity-event-image-viewer-widget-plugin %}

The Event Image Viewer Widget Plugin is a Cumulocity IoT module federation plugin created using c8ycli. This plugin can be used in Application Builder or Cockpit.

[![Event Image Viewer](https://global.discourse-cdn.com/techcommunity/optimized/3X/1/9/19a33a31b1bce5b3949ad91c6295baa9c9f9080d_2_489x500.png)](https://global.discourse-cdn.com/techcommunity/original/3X/1/9/19a33a31b1bce5b3949ad91c6295baa9c9f9080d.png "Event Image Viewer")

## Silo Capacity Widget Plugin

**Author:** [@Sheethal\_JR](https://tech.forums.softwareag.com/u/sheethal_jr)

The [Silo Capacity Widget Plugin](https://github.com/SoftwareAG/cumulocity-silo-capacity-widget-plugin) is a custom plugin that provides a visual representation of the current state of a silo. It displays a configurable silo capacity graphic with fill levels, a foreground image overlay, an optional background image, and colorized thresholds.

{% embed https://github.com/SoftwareAG/cumulocity-silo-capacity-widget-plugin %}

This widget is especially useful in industries where monitoring silo capacity is crucial, such as agriculture and manufacturing.

![Silo Capacity](https://global.discourse-cdn.com/techcommunity/original/3X/6/0/60e11f2acf39343408a5e4e09cfa402cf365840d.png)  
 ![Oil Storage](https://global.discourse-cdn.com/techcommunity/original/3X/4/a/4abcf126acb5943e14667cadc373b8782f861a77.png)  
 ![Battery Capacity](https://global.discourse-cdn.com/techcommunity/original/3X/8/7/871913fcbef9b23b46e33d9d0676090fba3f5cbd.png)  
 ![Fuel level](https://global.discourse-cdn.com/techcommunity/original/3X/6/2/62bb325e0f0605389a4f742b77c1ddd27131c7cc.png)

## 3D Model Viewer Widget Plugin

**Author:** [@Ravi\_Shankar\_Kumar](https://tech.forums.softwareag.com/u/ravi_shankar_kumar)

The [3D Model Viewer Widget Plugin](https://github.com/SoftwareAG/cumulocity-3d-model-viewer-widget-plugin) is a unique tool that allows you to view a 3D collada model (\*.dae, \*.obj, \*.gltf) in Cumulocity IoT.

{% embed https://github.com/SoftwareAG/cumulocity-3d-model-viewer-widget-plugin %}

This widget supports measurements from a single device, allows background color customization, and allows you to configure real-time device measurements for model movements.

[![3D Model Viewer](https://global.discourse-cdn.com/techcommunity/optimized/3X/b/f/bf2948028b3048429e1b685aa30a3734d4d5dd1c_2_690x418.png)](https://global.discourse-cdn.com/techcommunity/original/3X/b/f/bf2948028b3048429e1b685aa30a3734d4d5dd1c.png "3D Model Viewer")

## Image Animation Widget Plugin

**Author:** [@Ravi\_Shankar\_Kumar](https://tech.forums.softwareag.com/u/ravi_shankar_kumar)

The [Image Animation Widget Plugin](https://github.com/SoftwareAG/cumulocity-image-animation-widget-plugin) is designed to display a series of images in an animated sequence.

{% embed https://github.com/SoftwareAG/cumulocity-image-animation-widget-plugin %}

This widget supports scrolling an image up, down, left or right, fading in, fading out, rotating an image, and swapping from one image to another. It offers customizable animation speeds, providing a flexible and engaging data visualization tool.

![Image Animation Fence](https://global.discourse-cdn.com/techcommunity/original/3X/4/8/48667c106f6a7c297af7be0a6236f71860a7121d.gif)  
 ![Image Animation Lock](https://global.discourse-cdn.com/techcommunity/original/3X/5/d/5d9e699c8ba1c15ee9fb76c77487a25af7291232.gif)

## Device Details Widget Plugin

**Author:** [@Ravi\_Shankar\_Kumar](https://tech.forums.softwareag.com/u/ravi_shankar_kumar)

The [Device Details Widget Plugin](https://github.com/SoftwareAG/cumulocity-device-details-widget-plugin) is a comprehensive tool designed to display the details of a device. It fetches the details from an API call and displays the data according to the fields provided.

{% embed https://github.com/SoftwareAG/cumulocity-device-details-widget-plugin %}

The widget plugin has the ability to summarize information relating to the names from the API call.

![Device Details](https://global.discourse-cdn.com/techcommunity/original/3X/4/d/4d679c6c3ede85e607a73ae141c9bb36464b6108.png)

## Advanced Radial Gauge Widget Plugin

**Author:** [@Sheethal\_JR](https://tech.forums.softwareag.com/u/sheethal_jr)

The [Advanced Radial Gauge Widget Plugin](https://github.com/SoftwareAG/cumulocity-advanced-radial-gauge-widget-plugin) is a dynamic tool that shows the latest real-time measurement on a radial gauge. This widget offers customizable gauge colors and sizes, providing a visually appealing and informative display.

{% embed https://github.com/SoftwareAG/cumulocity-advanced-radial-gauge-widget-plugin %}

It also supports multiple measurement units and allows for the customization of the gauge’s minimum and maximum values.

![Advanced Radial Gauge](https://global.discourse-cdn.com/techcommunity/original/3X/0/4/049492ad740448516b7411c0dd81678f346f6982.png)

## Weather Forecast Widget Plugin

**Author:** [@Ravi\_Shankar\_Kumar](https://tech.forums.softwareag.com/u/ravi_shankar_kumar)

The [Weather Forecast Widget Plugin](https://github.com/SoftwareAG/cumulocity-weather-forecast-widget-plugin) is a comprehensive tool that displays a 5-day weather forecast using data provided by the OpenWeatherAPI.

{% embed https://github.com/SoftwareAG/cumulocity-weather-forecast-widget-plugin %}

This widget provides real-time weather updates and allows for configurable refresh rates, ensuring that the most current weather data is always displayed.

[![Weather Forecast](https://global.discourse-cdn.com/techcommunity/optimized/3X/1/f/1f4d4eb91ac239b3bdcf08d6303bc66a19ac68b3_2_690x262.png)](https://global.discourse-cdn.com/techcommunity/original/3X/1/f/1f4d4eb91ac239b3bdcf08d6303bc66a19ac68b3.png "Weather Forecast")

## Additional information

Each 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, it cannot guarantee to include every contribution in the master project.

## Relevant Articles

- [Cumulocity Digital Twin Manager - Early Preview Release](https://tech.forums.softwareag.com/t/cumulocity-digital-twin-manager-early-preview-release/258437)
- [Advanced Cumulocity IoT Microservice Monitoring - Part 1](https://tech.forums.softwareag.com/t/advanced-cumulocity-iot-microservice-monitoring-part-1/274963)
- [Cumulocity IoT Web Development Tutorial - Part 2: Create your first component](https://tech.forums.softwareag.com/t/cumulocity-iot-web-development-tutorial-part-2-create-your-first-component/265762)
- [Open Source | Software AG](https://open-source.softwareag.com/)


[Read full topic](https://tech.forums.softwareag.com/t/enhancing-cumulocity-iot-capabilities-custom-information-display-widgets/281189)