How to avoid drawing a Graph outside of the Window ?

Question

Hello Embedded Wizard Team,

      I started developping a GUI that will draw a Graph progressively on the screen so I added a Graph, a CoordList, a Timer and a Variable. This is the code implemented in the Slot method:

sender; /* the method is called from the sender object */

/* I chose a sin wave as a demo for my GUI for simplicity purposes, this will be later changed to the desired data */

var float Y = math_sin(Variable1) * float(120);

Variable1 = Variable1 + 3;

CoordList.AddCoord( Variable1, Y);

/* This If statement will make the animation loop instead of drawing the line outside the window */

if (Variable1 >960)
  {
    Variable1 = 0;
    CoordList.ClearList();
  }
Graph.Coordinates = CoordList;

this is the result i got ( I used the Button component from the VehicleDataLogger demo ) :

https://1drv.ms/u/s!AniT7vb6nSSFmHSLsb-y2LJQgrGR

So my question is : how can i make the graph keep drawing inside the borders of the window like in the VehicleDataLogger? Is there a way to do that with the Outline Box tool or am I supposed to shift manually every Coordinates by the step I'm using ? (this is approximately the result I'm looking for. Sorry for the long URL):

https://www.google.com/imgres?imgurl=https%3A%2F%2Fi.imgur.com%2Fc9P9FPl.gif&imgrefurl=https%3A%2F%2Fwww.reddit.com%2Fr%2Foddlysatisfying%2Fcomments%2F4ygw9s%2Funrolling_a_sphere%2F&docid=tcM3qQig3fdWPM&tbnid=5zoM9u-H-tP_mM%3A&vet=10ahUKEwic1IuYpNngAhVjxoUKHehDDMoQMwg-KAIwAg..i&w=432&h=219&client=firefox-b-d&bih=642&biw=1366&q=sine%20wave%20drawing%20gif&ved=0ahUKEwic1IuYpNngAhVjxoUKHehDDMoQMwg-KAIwAg&iact=mrc&uact=8#h=219&imgdii=oVVkxeOu_SDaHM:&vet=10ahUKEwic1IuYpNngAhVjxoUKHehDDMoQMwg-KAIwAg..i&w=432

Best regards,

 

Answer 1

Hello,

   I figured it out ! I tried using Outline Box but it didn't lead me to anything. So what I did is:

_ Remove the If statement from the Slot ( which was just for demonstration purposes ).

_ Add the InvalidateViewState(); method after adding a new Coordinate (to call the UpdateViewState method) .

_ Add this line of code in the UpdateViewState method:

aState;
Graph.CoordOrigin = point (Graph.Bounds.w - (Variable1 * Graph.PixelPerUnit.x), Graph.Bounds.h -127);

Best regards,

Comments

Hello,

using the Outline Box is not helpful for this use-case, because it is a container to manage GUI components.

In case you want to shift the content within the graph you can use the property CoordOrigin of the Charts::Graph object. However, there is no need to do that within the UpdateViewState method and to make a call to InvalidateViewState().

Just add the new coordinate to the CoordList, assign the CoordList to the Graph and set the CoordOrigin to the desired value.

Best regards,

Manfred.