Improvements in pre-defined Platform Gadgets

Owned by Onesait Platform
20/11/23
4 min read

Available from Release 5.2.0 of Onesait Platform

Introduction

In this version, we have improved the look and feel of the predefined platform gadgets.

The improvements are explained below:

Incorporated improvements

The main improvement has been the inclusion of the Vue and Echarts libraries for the creation of gadgets, thus offering greater technical power, as well as a renewed style.

The gadgets that have been renewed in this version are the following:

  • Pie

  • Line

  • Bar

  • Table

  • Map

In this version you can find them in the drop-down menu that appears on the right side of the screen while editing a Dashboard.

From there you can drag and drop them and configure the parameters you want them to appear until you get something like this for example:

Footer

You can set different layouts of the chart from the settings, such as the style of the "Pie".

In the same position there is also a button that will give you the possibility to reset the filters that affect your gadget.

Below you can see some examples of this new chart and the different styles you can use:

Line

This chart has important updates. Among them we find the customization of styles on each data series and the possibility of setting a marker on the maximum and minimum points, as well as an average line on your data.

Focusing on the top right of the chart, you can find different buttons that give access to new functionalities. With the first one from the left you can zoom in on the part you want, and with the second one you can reset this zoom.

The next ones will allow you to switch between a line chart and a bar chart.

And finally, you will have the options to save the chart as an image and to reset the filters that affect it.

Bar

Regarding the customization of this gadget, we can highlight the new possibility to create it in vertical or horizontal position, as well as the new zoom bars that allow you to center it from the beginning on a specific section of the chart.

With the buttons located in the upper right corner of the chart, you have the possibility to switch to a "Stack" style, switch between a line or bar chart, zoom to a specific part of the data, save the data as an image and reset the filters that affect this gadget.

With these improvements we offer different options to get more customized styles as we can see below:

Map

The previous gadget has been completely updated to include in this new version the "OpenLayers" library which allows to extend the functionalities and give a new style to this graphic.

When configuring, you are allowed to choose from a wide variety of icons as it uses Google's "Material Icons" library.

You can select between different layers for the map display, either "Satellite" or "OpenStreetMap".

You also have the possibility to create a "Pop Up" with all the information you want, plus the option to change the style of the marker when you select it to have more visual aid.

As a last new feature, there is the option to create "rules" that affect the color of the markers so that, for example, if we have a temperature map, the marker will change color according to it.

Table

As for this chart, the style has been updated, giving it a completely new design, and allowing a greater configuration of the data displayed per column.

With this update, it is possible to create "rules" that allow changing the color of the data displayed, for example so that if that data is greater than 100, the color is changed to red.

There is also now the possibility of adding suffixes and prefixes common to all data, in addition to configuring the message to be displayed in case there is no data for that column.

Native export to XLSX

In this new version of the platform, gadgets based on templates, have a native export to XLSX with the Download Data option that appears in the menu of each gadget.

 

cThis download, if you want to adjust it in the template, can be done by overwriting the function vm.downloadData

Other improvements

  • Improvements in gadget filter by selector (Vue Select) and inclusion of native datapicker.

  • Improvements in the gadget template editor

  • Default transform: it is now possible to send transformations (filters or operations on the datasource) before launching the initial datasource.

Â