This component allows you to create graphs using gathered information and to display them in the user interface. Each information deriving from a sensor, or counter, or switch can be used to be represented in a chart.
- With the Chart component you can check the energy production the consumption of your home, building, hotel, etc.. over time
A reminder before continuing:
Before using this component it is recommended to view the technical guides of the following components to fully understand the process of configuration of the component Chart:
This component’s sample is made by using Graphic UI gateway.
Please refer to “Gateways / Protocols” guide in order to get further info.
You can choose from any Recorder‘s component which data you want to record.
Default time lapse: Time lapse of the chart’s data visualization that will be set as default once the chart is opened insid the user interface (Day, Week, Month, Year);
Chart’s date picker: Date picker component that allows the chart’s date selection on the user interface;
Chart’s range picker: Drop Down component that allows the chart’s range selection on the user interface;
Min value: Min axes’ value, leaving this field empty will set automatically the scale’s values;
Max value: Max axes’ value leaving this field empty will set automatically the scale’s values;
Draw axis: Allows to enable or disable the drawing of the graph axis, in the map view mode it will allow overlapping one or more graphs;
Axes color: Color that will be applyed to the chart’s axes;
Grid color: Color that will be applyed to the chart’s grid;
Text color: Color that will be applyed to the chart’s text;
Data color: Color that will be applyed to the chart’s data;
Date picker offset: Allows you to watch different graphs on the same map using different time intervals;
COMPONENT INTERFACE VISUAL RESULT
The different time views are displayed in the user interface
Chart’s interface inside the EVE Remote Plus app (Classic and Map)
Chart’s date picker icon. Tap on it to change the date.
Move it forward and back to analyze chart’s data.
Chart’s range picker icon. Tap on it to select a different time lapse (Day, Week, Month, Year).
How to set up a Chart (test project)
Add a new Chart component in the project, then select the wanted data source from the “Data source” drop down menu in component properties.
Once the data source is choosen you can now add the chart component inside the User interface, in this test we are using the Classic user interface. Enter the “User interface section by selecting it from the section menu and add a new main menu icon then add the Slider component in the user interface editor component inside the third level of the editor (Picture 1). Then upload the project into the server filling up the conection parameters in the Upload window (Picture 2).
The Recorder need the logic module up and running in order to record data. In order to display the data inside the chart the recorder needs to record the data, in this case the data will be recorded every time the Slider moves. The recorded data will be compared each minute with the data recorded the minute before in case of a dense data recording.
By clicking the chart component icon you will enter its user interface, here by dragging the slider on the bottom of the interface, allows you to consult the data recorded.