Graphing Data in Processing

Following on from my first forray into Processing, I needed to display some data in a simple graph, with time as the X axis and scaled data value as the Y axis.

I thought I would post what I came up with here, as I think its quite nice (although perhaps not the best designed code) and it does a job which might be useful for others.

Design idea

I wanted to display a time-varying variable as a point on a graph, with a straight line between each data points. I wanted to be able to scale the whole graph easily. It needed to be be easy to read. I had a stream of data which entered my progam every second.

Processing Code

Here is the code I came up with. It uses a random input variable, so that you can view the example. You would need to change the random variable into your data point.

And here is the code, hopefully with some useful comments. You should be able to cut and paste it straight into a new Processing sketch and get a graph similar to the one above.

Feel free to adjust and re-use as you might require.

Leave a Reply

Your email address will not be published. Required fields are marked *