Select Page

chartChart


INTRODUCTION

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.

USE CASES

  • 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:

  • Recorder
  • Info
  • Download and Install EVE Logic plugin to enable plugins (link);
  • After loading .eve project to the server, wait a couple of minutes for logics activation.

COMPONENT’S PROPERTIES

Customizable component’s title and icon. Please refer to “Common properties” guide.

GUI

This component’s sample is made by using Graphic UI gateway.

Please refer to “Gateways / Protocols” guide in order to get further info.

Chart’s data source: The component that defines data displayed on the chart;
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 pickerDate 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;

Note: Text field available for additional information on the component from the admin side.

eden-remoteEVE Remote Plus


Three different view mode possibilities: “CLASSIC”, “MODAL” and “HIDDEN”. Learn more about the component’s view modes.

COMPONENT INTERFACE VISUAL RESULT

The different time views are displayed in the user interface

DAY

WEEK

MONTH

YEAR

Chart’s interface inside the EVE Remote Plus app (Classic and Map)

The chart’s date is shown next to the date picker Icon

Chart’s date picker icon. Tap on it to change the date.

Zoom in / zoom out in the chart interface by spreading the fingers on top of the chart data, or click both right and left mouse buttons at the same time and moving the mouse forth in order to zoom in and back to zoom out.

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

This is a step by step guide that shows how to set up a chart component. Here you will learn how to set up a Chart from scrach begginning with the compoent basic till the interface displayment.

Step 1:

First add a new Recorder component inside the project, then insert the component you want to record inside the component list on the Recorder component properties. In this example we are using a slider component as data source.

How to add the components that we are recording into the Recorder component inside the Home automation software EVE Manager
Step 2:

Add a new Chart component in the project, then select the wanted data source from the “Data sourcedrop down menu in component properties.

Adding the chart component inside the project and set up of the data source in the chart component properties inside the Home automation software EVE Manager
Step 3:

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. Then upload the project into the server filling up the conection parameters in the Upload window.

Adding the main menu icon and the first the slider component inside the User interface of the Home automation software EVE Manager

Picture 1

Adding the chart and uploading the project into the Home automation server EVE

Picture 2

Step 4:

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.

Recording the data coming from the slider component from inside the Home automation app EVE Remote plus
Step 5:

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.

Data visualization from inside the chart component within the Home automation app EVE Remote plus

Click the link below to download the Chart’s demo project and try it your self.

Download the demo project here!

Still Need Help? Our Customer Service Is Here For You.