OwnPlot - owntech-foundation/Tutorials GitHub Wiki

Objective

This tutorial aims to learn to use Ownplot, our graphical interface. This will allow you to monitor variables from your power device. We will start with the previous tutorial.

Required hardware

• TWIST
• PC 64-bits (windows or linux)

Required software

• Git
• Visual Studio Code with PlatformIO (see Blinky tutorial)

We will use OwnPlot to monitor variables. Download OwnPlot by going to https://github.com/owntech-foundation/OwnPlot/releases. Scroll down a bit and you will arrive at the page below. (You will download V0.6.0)

Download and install the software according to your system.

In Windows, download the exe file and execute it. In Linux, allow the appImage to be executed as a code.

Launch OwnPlot. Here is how it looks like when open.

Create the project

1. Let's go back to VSCode. In the side menu, click on the Source Control button, Which will open a new menu.

You can see that the only changes on your code are located at the main.cpp file. We are going to commit these changes as to keep track of our progress.

2. Click on the + button on the right side of the main.cpp file to "stage" the changes. You can add a comment to explain what these changes are useful for. It is good practice to describe your changes when you commit them in git. Click on the + Commit button. Your work has been committed, we can come back to it later if necessary.

Step-by-step implementation

3. Define the variables

We will define a dummy variable that will be updated.

In src/main.cpp, in the section USER VARIABLE DECLARATIONS, define the dummy variable counter.

//--------------USER VARIABLES DECLARATIONS----------------------

static uint32_t counter = 0; //counter variable

4. Configure the hardware peripherals and the software scheduling

In src/main.cpp, in the setup_routine(), do not modify anything.

5. Loop communication task

In the communication task, you will create the possibility of increasing or decreasing the counter dummy variable via the Serial Interface.

In src/main.cpp, in the function loop_communication_task(), add the following code.

void loop_communication_task()
{
    received_serial_char = console_getchar();
    switch (received_serial_char) {
        case 'h':
            //----------SERIAL INTERFACE MENU-----------------------
            printk(" _____________________________________\n");
            printk("|     ------- MENU ---------          |\n");
            printk("|     press i : idle mode             |\n");
            printk("|     press s : serial mode           |\n");
            printk("|     press u : counter UP            |\n");
            printk("|     press d : counter DOWN          |\n");
            printk("|_____________________________________|\n\n");
            //------------------------------------------------------
            break;
        case 'i':
            printk("idle mode\n");
            mode = IDLEMODE;
            break;
        case 's':
            printk("serial mode\n");
            mode = SERIALMODE;
            break;
        case 'u':
            counter++;
            break;
        case 'd':
            counter--;
            break;
        default:
            break;
    }

}

6. Loop application task

The application task will print the value in the counter dummy variable whenever the SERIALMODE is ON.

In src/main.cpp, in the function loop_application_task(), add the following code.

void loop_application_task()
{
    if(mode==IDLEMODE) {
        spin.led.turnOff();

    }else if(mode==SERIALMODE) {
        spin.led.turnOn();
        printk("%d\n", counter);
    }
    
    task.suspendBackgroundMs(100); 
}

8. Loop critical task

In src/main.cpp, in the loop_critical_task() function, do not modify anything. This control task will remain empty for this tutorial.

9. Connect hardware

• Connect the USB power supply cable. The LED2 of the SPIN should be ON.

10. Build and Upload (+ ).

11. In the bottom toolbar, click on the Serial Monitor icon. Select it and press the h key. Press the s key: you should see the current value of counter on the Serial Monitor.

Expected outputs

• Press the i key to switch to IDLEMODE: stop printing counter and turns the LED1 OFF.
• Press the s key to switch to SERIALMODE: prints counter and turns the LED1 ON.
• Press the u key to increase the counter.
• Press the d key to decrease the counter.

OwnPlot Visualization

We will now visualize the value of counter using OwnPlot, instead of the Serial Monitor.

12. First kill the Serial Monitor by clicking on the trash button on the right hand side of the window as shown in the image below.

13. Launch OwnPlot. In Port tab, choose the STLinkV3. Click on the Closed button to open the port. It will switch to 'Open'.

:warning: The Port might have a different name depending on your operating system. If you don't find the used port, then disconnect and reconnect and verify the port which appears.

14. In OwnPlot, Settings tab, set the # of channels to 1.

15. In OwnPlot, in the Chart tab, scroll down to 'Legend' and change the same of Dataset 1 to Counter.

16. In OwnPlot, in the 'Send' tab, there are some already configured command. You can add other if you need by typing the command name and its associated character. Here we will use those pre-configured.

As we have configured in our code :

• idle mode set the LED off ;
• serial mode set it on ;
• up increase the counter ;
• down decrease the counter.

17. In OwnPlot click on the Serial button corresponding to the s command to switch to SERIALMODE and turn the LED1 ON. You should see the value of Counter on your OwnPlot window and its raw value on the terminal below. You can increase and decrease the counter, by clicking on Up and Down buttons. OwnPlot will automatically update the size of the window as you change the value of the variable.

18. In OwnPlot, click on the Idle button corresponding to the i command to switch to IDLEMODE and turn the LED1 OFF. OwnPlot stops displaying the value of counter and the window will continue to scroll since the port is still open.

You have learn to set data visualization with the Ownplot graphical interface.

That’s it!

Contributors

• 2021.11.04: Romain Delpoux, Loïc Quéval, Adrien Prévost
• 2021.11.07: Luiz Villa, Antoine Boche
• 2022.01.24: Luiz Villa, Loïc Quéval
• 2022.02.01: Luiz Villa
• 2022.02.22: Luiz Villa
• 2022.03.13: Luiz Villa
• 2022.06.23: Loïc Quéval, Romain Delpoux
• 2022.01.16: Luiz Villa
• 2022.07.10: Luiz Villa
• 2023.10.06: Mathilde Longuet