How to create animated line graph in Processing?

IΒ΄m trying to make an animated line graph using data from .csv

I want to animate the lines and add the name of the series to the end of the line like this example:

Household debt balances (excluding mortgages)

β€” πŸ“ˆ π™»πšŽπš— π™Ίπš’πšŽπšπšŽπš› πŸ“Š (@lenkiefer) 13 de enero de 2019

Also I want to animate the x-axis and y a-xis.
Here’s the example I’m trying to emulate:

Is it possible to make this graph using processing?
Which library should I use?
Any suggestions?


It certainly is possible.

Check out the examples and tutorials here:


A simple plot example to get you started:

int limit;
float x, y;

void setup() 
  size(640, 480);

void draw() 
  line(0, height/2, width, height/2);
  line(width/2, 0, width/2, height);
  limit++;                        //Increments each frame
  if (limit > width) limit = 0;  
  stroke(255, 0, 0);
  for(int i = 0; i< limit; i++)
    x = i*TAU/100;  
    y = 100*sin(x) + 50*cos(x/2);
    point(i, y + height/2);      // Points for now
  textAlign(LEFT, CENTER);
  text(y, limit+10, y + height/2);  

Take a look at the references and explore the possibilities!

There may be a library out there somewhere; this can be done without one.



and the CSV part could start like:

// /data/data.csv

Table table;
String infile = "data/data.csv";
int trows = 0, tcols;   

void setup() {
  size(500, 500);
  background(200, 200, 0);
  get_Table();  //___________

void draw() {
  //  background(200,200,0);

void get_Table() {
  table=loadTable(infile, "header");
  trows = table.getRowCount();
  tcols = table.getColumnCount();
  println("rows: "+trows+" columns: "+tcols+" in file: "+infile);
  table.setColumnType("breakfast", Table.INT); // optional type setting...
  fill(0); //__________________________________________________________________ text color on canvas
  int dy =0;
  for ( int c = 0; c < tcols; c++)  text( table.getColumnTitle(c)+" ", 10+100*c, 10); //__ header line
  for ( int r = 0; r < trows; r++) { //________________________________________ get data lines
    TableRow thisrow = table.getRow(r);
    for ( int c = 0; c < tcols; c++ ) text( thisrow.getString(c), 10+100*c, 10+15*dy );

actually the most tricky part would be if you want add / edit / the csv data from processing.
tell us if you want go for that.


Thanks. IΒ΄m trying to plot a graph from CSV data.
My data:

I’m trying to do is something like this:

Instead of the data value like the example share by @glv, I’d like the labels ( Breakfast) to be to the right of the last data point for each series.

How can I do that?

Check out the references:

My example displays a numeric value and you want to display a string.


i see your β€œdata”
and must ask you where you got that from?

as a (running) database that would be not useful,
actually in my example i show how it should look
a day record should be a new line in CSV file… ( and not a column )
( and i have a diabetics spreadsheet file ( google / drive ) for 10 years now )