Add sensor data to chart (potentiometer, vibration, temperature)

How to
,
1

hi guys i tried to add data of a potentiometer between -100 and 100 to the chart of my screen. how can i add im a beginner. please help

"
// This file was generated by SquareLine Studio
// SquareLine Studio version: SquareLine Studio 1.4.0
// LVGL version: 8.3.6
// Project name: SquareLine_Project

#include “ui.h”

void ui_Screen2_screen_init(void)
{
ui_Screen2 = lv_obj_create(NULL);
lv_obj_clear_flag(ui_Screen2, LV_OBJ_FLAG_SCROLLABLE); /// Flags
lv_obj_set_style_bg_color(ui_Screen2, lv_color_hex(0x267AB0), LV_PART_MAIN | LV_STATE_DEFAULT);
lv_obj_set_style_bg_opa(ui_Screen2, 255, LV_PART_MAIN | LV_STATE_DEFAULT);

ui_Label1 = lv_label_create(ui_Screen2);
lv_obj_set_width(ui_Label1, LV_SIZE_CONTENT);   /// 1
lv_obj_set_height(ui_Label1, LV_SIZE_CONTENT);    /// 1
lv_obj_set_x(ui_Label1, -220);
lv_obj_set_y(ui_Label1, -211);
lv_obj_set_align(ui_Label1, LV_ALIGN_CENTER);
lv_label_set_text(ui_Label1, "Broyeur: Donnees Vibrations...");
lv_obj_set_style_text_font(ui_Label1, &lv_font_montserrat_18, LV_PART_MAIN | LV_STATE_DEFAULT);

ui_Button2 = lv_btn_create(ui_Screen2);
lv_obj_set_width(ui_Button2, 160);
lv_obj_set_height(ui_Button2, 50);
lv_obj_set_x(ui_Button2, -296);
lv_obj_set_y(ui_Button2, 204);
lv_obj_set_align(ui_Button2, LV_ALIGN_CENTER);
lv_obj_add_flag(ui_Button2, LV_OBJ_FLAG_SCROLL_ON_FOCUS);     /// Flags
lv_obj_clear_flag(ui_Button2, LV_OBJ_FLAG_SCROLLABLE);      /// Flags

ui_Chart1 = lv_chart_create(ui_Screen2);
lv_obj_set_width(ui_Chart1, 729);
lv_obj_set_height(ui_Chart1, 313);
lv_obj_set_x(ui_Chart1, -2);
lv_obj_set_y(ui_Chart1, -11);
lv_obj_set_align(ui_Chart1, LV_ALIGN_CENTER);
lv_chart_set_type(ui_Chart1, LV_CHART_TYPE_LINE);
lv_chart_set_range(ui_Chart1, LV_CHART_AXIS_PRIMARY_Y, -100, 100);
lv_chart_set_axis_tick(ui_Chart1, LV_CHART_AXIS_PRIMARY_X, 10, 5, 5, 2, true, 50);
lv_chart_set_axis_tick(ui_Chart1, LV_CHART_AXIS_PRIMARY_Y, 10, 5, 5, 2, true, 50);
lv_chart_set_axis_tick(ui_Chart1, LV_CHART_AXIS_SECONDARY_Y, 10, 5, 5, 2, true, 25);



ui_Label2 = lv_label_create(ui_Screen2);
lv_obj_set_width(ui_Label2, LV_SIZE_CONTENT);   /// 1
lv_obj_set_height(ui_Label2, LV_SIZE_CONTENT);    /// 1
lv_obj_set_x(ui_Label2, -300);
lv_obj_set_y(ui_Label2, 204);
lv_obj_set_align(ui_Label2, LV_ALIGN_CENTER);
lv_label_set_text(ui_Label2, "Retourner a l'accueil ");

ui_Label4 = lv_label_create(ui_Screen2);
lv_obj_set_width(ui_Label4, LV_SIZE_CONTENT);   /// 1
lv_obj_set_height(ui_Label4, LV_SIZE_CONTENT);    /// 1
lv_obj_set_x(ui_Label4, 534);
lv_obj_set_y(ui_Label4, 119);
lv_obj_set_align(ui_Label4, LV_ALIGN_CENTER);

lv_obj_add_event_cb(ui_Button2, ui_event_Button2, LV_EVENT_ALL, NULL);

}

What do you want to achieve?

What have you tried so far?

Screenshot or video

Others

  • SquareLine Studio version:
  • Operating system:
  • Target hardware:
1 Like
2

Replied in the other topic: How to use Chart widget, ie for temperature data - #10 by the_forgeron

3

Here is a video that explain the project.

the final goal is to have a vibration sensor put on motor. the chart will show the vibration of motor when i selected wich one.
i just want to have the data from vibration sensor, to be on screen when i click, instead of a static chart.

here is my full project. im using an elecrow hmi esp32 7" inch display. you can try it with a 5" display make sure to make some modification(explanation in the code)

4

And what is question?

1 Like
5

just wanna know how do you manage to replace the static data with a variable data that come from an mpu6050?or potentiometer but its the same thing.

6

Place chart up code here

bool once = true;
uint32_t looper5;
 lv_chart_series_t * ui_Chart1serie1 ;

void loop()
{
    lv_timer_handler();
    delay(5);
looper5++;
if( once ) {
once = false;
ui_Chart1serie1 = lv_chart_get_series( ui_chart1, NULL );
}
if((looper5%20) == 0 && lv_scr_act() == ui_Screenx) {
//show new sensor to chart read it here or in other thread and here only show

}
}

How to use Chart widget, ie for temperature data - How to - Forum - SquareLine Studio

https://docs.lvgl.io/master/API/widgets/chart/lv_chart.html

7

put i t where in the main code or in the screen where the chart is ??

image
image778×1006 149 KB

8

Looks like Marian is giving an example of how you would dynamically update a chart with your sensor data. This would probably be put into a thread (if you wanted constant updating), or could be put into your main code so it only updates when you are on the given screen with your chart (I think the code Marian has would account for that). You’d probably want this somewhere with your system/main code, not in the exported code

9

Ahhh sorry , but your image show level of your noooob… Arduino have one loop and when you dont know where go back to LEGOLAND

10

The code example shouldn’t go at all into the ui folder, but outside of it into the main ui/ui.ino file which contains the loop function by default. Your custom updater code can go beside lv_timer_handler as the example shows so it is called periodically as well.

1 Like
11

so this is an update for those who struggling in the beginning like me. there still work to make the update perfect but i make a big step. for now the chart will update a random series.
this is the main.ino code (the general code)
main code.txt (8.5 KB)
this is the ui_screen3 code where the chart is display
ui_screen3.txt (2.8 KB)

Some part of the code is commented in french so dont be surprise !!!
here a video of the result :

and Marian_M you should come to LEGOLAND too for explaining like a sh**
(updating chart dynamically, variable chart lvgl, lv_chart) (psss this song is a banger: blame brett - the beaches)

12

hi everyone this is an update.
@Marian_M thanks for your help man.
:joy: had so much fun doing this vid

to be serious I managed to make the link between the vibrations of the accelerometer and displayed on the screen. I will update the code on github, thanks for everyone heps.

1 Like
13

Thanks for sharing your solutions with the community.

1 Like
14

Hi everyone, here are my results:

In this project, I’m using two boards: the HMI ESP32 7-inch screen and the ESP32 Wrover board. The first one is an HMI ESP32 7-inch screen that receives and prints the data, while the second one is an ESP32 Wrover that gathers vibration data from an MPU6050 and sends it to my HMI screen via the ESP-NOW protocol.

The code I’m sharing is for the HMI 7-inch screen.

This is the main.ino code (main part). It receives vibration data from the ESP32 Wrover using the ESP-NOW protocol. Here is how I manage to receive it and update the data in Chart 2 to display a vibration curve.
main.ino.txt (10.7 KB)

-this is the screen3 where vibrationY will be print on the chart2
ui_screen.txt (2.6 KB)

Hope it Will help someone
At the moment I’m trying to correct the error that causes the screen to shift to the right. (just a little error)

2 Likes
15

Hello and welcome. I am pleased to come across this post and review it, looking at the issues and solutions within it. I found that your post and program are suitable for helping me in creating my program
My program It relies on reading voltages from the ADS1115 chip and displaying them on separate screens
The first screen has four buttons.
Each button leads to a new screen
The second screen shows the value of the first input of ads1115
The third screen shows the value of the four input of ads1115.
The fourth screen shows the comparison value between the first and second inputs, as well as the comparison value between the third and fourth inputs.
Another addition, can I adjust the Gain value on the ads1115 through the screen?
thank you for your help

16

hello
i sent you a private message for assistance, but I haven’t received a reply
I apologize if you are busy, but I found your project very suitable for me,
Especially since I do not ask for support or help until research and experimentation exhaust me

17

Hi, since you have already posted this topic in another forum, we will respond to you there soon. Thank you for your patience.