How to add timestamp as a label on X-axis for dynamic graph in TouchGFX?

[Shree]

Hi,

I am working on implementing the graph using Dynamic graph widget which was recently introduced in latest TouchGFX release. In our application we collect data points after regular time interval e.g We may collect 144 data points for 12 hours. So, I want to plot the chart for parameters values Vs Time. To do that I need to show a time as X-axis label.

As I am selecting the number of data points as 144 here, it by default configure the label according to number of data points. So, how can I show time on X-axis and parameter value on Y-axis?

BR,

Shree

[GPa.1]

Hi Shree,

Did you find a way to add the timestamp?

[JureL]

I have a similar need to display temperature over time. I would like to display the timestamp on X axis and temperature on Y. @Martin KJELDSEN​ any suggestion or perhaps example of that?  

[Romain DIELEMAN]

Hi,

I am a little bit confused by what the issue is. The UI template " Dynamic graph example" in TouchGFX Designer displays random values over time: at every second tick of the system a random point is displayed as you can see in the following code in mainscreen.cpp

void MainView::handleTickEvent()
{
    tickCounter++;
 
    // Insert each second tick
    if (tickCounter % 2 == 0)
    {
        float yMax = graph.getGraphRangeYMaxAsFloat();
 
        // Insert "random" points along a sine wave
        graph.addDataPoint((int)((sinf(tickCounter * .02f) + 1) * (yMax / 2.2f)) + randomish(tickCounter) % (int)(yMax / 10.f));
    }
}

To my understanding for your project you just need to replace the random value by the temperature and plot it whenever you want (so every 5 minutes for example instead of every two ticks like in the demo). If you want a timestamp like 1970-01-01 00:00:01 you can write it by yourself in the label section of a dynamic graph property setting or you can add an extra textArea widget under the x axis.

Please correct me and guide me if I am completely out of topic.

Best regards,

Romain

[JureL]

Hey @Romain DIELEMAN​ ​ ,

I apologize for the unclear question.  I want to know how to add label like you said : 1970-01-01 00:00:01. For example: we measure temperature every  15 seconds so when temperature is measured i want to add point in graph with corresponding timestamp which is shown on x axis. Is there any example on how to do that ?

Here is a example of what I want:

[Romain DIELEMAN]

Hi,

We do not have a graph example with a timestamp but as explained the label and the text displayed on the X axis can be modified by yourself to display a timestamp.

Have a look at the UI template "Dynamic Graph example" available from TouchGFX Designer when you create a project (link to the online documentation). In the "Settings" tab on the right, scroll down to the "X-AXIS LABELS" section.

You will see how to set how the text of the values on the abscissa are displayed. It corresponds to the way texts are handled in TextArea widgets,

Have a look at the textArea widget article and the UI template "Text Example" to understand how to work with text within TouchGFX Designer.

/Romain

[JureL]

So if I understand correctly. I need to make my own Label as AbstractGraphDecoration to add it on bottom of graph. So for my case I can't use class GraphLabelsX .

[MRebo.1]

Did you manage to add the timestamp? I still don't understand how to add.

[MRebo.1]

Do I need to add more than one text?

[PBull]

Does anyone has a working example with timestamps?

I mean, you can't even set a wildcard buffer/size, for the timestamp in the Designer.

Browsing the source code, everything seems to hardcoded and you can only show integer values on the X-Axis-Labels.

Did I miss something?

Best regards,

Peter