You can make a simple txt file with the the ending .csv
Fill it with data (example below), separate it with ,
don’t let the last line end with a Return, that would bring an empty line at the end imho
Example 1
File must be called : “ip.csv” (content see below)
here is a simple Sketch to show table data (Sketch from the forum)
/* This sketch randomly selects rows from a CSV file
these rows are then printed out to screen using
a 'typewriter' style effect.
I want the text to print out and then stay on screen for 5 seconds.
I then want the screen to stay blank for 5 seconds before starting again.
*/
final int state_typewriter = 0;
final int state_Show_Text = 1;
final int state_Blank_Screen = 2;
int state=state_typewriter; // state of the program
Table table; // table object
int timer; //creates a a timer variable
int counter = 0; //creates a counter variable and sets it to zero
String full; //a string to combine amount + name
void setup() {
size(1000, 1000); //size
// fullScreen(); //sets output to full screen
PFont font; //font
table = loadTable("ip.csv", "header");
smooth();
font = createFont("Arial", 48); //creates font
textFont(font, 120); //text font
textAlign(CENTER, CENTER); //aligns text to Center
selectRow(); //calls selectRow fucntion
timer=millis();
// typeWriter();
}
void draw() {
switch (state) { //this is the start of switch
case state_typewriter:
// this will be exectued if state = 0
// the typewriter
background (0); //background
typeWriter();
break; // break for case 0
case state_Show_Text:
// this will be exectued if state = 1
// the text stays on screen for 5 seconds.
if (millis()-timer > 5000) { //if 5 seconds has passed
timer=millis();
state=2; // move on
}
break; //break for case 1
case state_Blank_Screen :
// this will be exectued if state = 2
// the screen stays blank for a brief time OR 5 seconds before starting again.
background(0); //background
if (millis()-timer > 300) {
selectRow();
state=0;
}
break; //break for case 2
//
}//switch
}//func
// ---------------------------------------------------------------------
void typeWriter() {
text(full.substring(0, counter),
0, 40, width, height); //text to print
if (millis()-timer > 100) { //this is the typewriter effect
counter++; // go to next letter
timer=millis(); // reset timer
}
if (counter > full.length()) { //this if statement resets counter to 0 when text is finished
counter = 0; // reset
state=1;
}
}
void selectRow() {
TableRow row; //Table row object
String amount="", name=""; //two strings representing columns in csv
row = table.getRow((int)random(table.getRowCount())); //print a random row
amount = row.getString("amount"); //a string with amount
name = row.getString("name"); // prints name for row
full = amount + " " + name; //combines name and row into new String called full
// println (full); //just prints to serial monitor so I can test all is working
}
//
Here is the content of the csv
amount,species,name
0, Capra circus, Goat
1, Panthera Pardus, Leopard
2, Equus Zebra, zebra
Example 2
Here is another example showing circles (e.g. City Names and pos and radius is stored)
File must be called : “data.csv” (content see below)
// shows a Table
/*
example table - make a txt file in the sketch folder named
"data.csv" with this content:
x,y,diameter,name
112,122,22,Boy
212,222,32,Girl
312,322,12,Fred
*/
DataEntry[] dataList;
boolean hold=false;
DataEntry holdItem;
void setup() {
size(780, 660);
loadData();
}
void draw() {
background(255);
// message upper right corner
fill(0);
textAlign(LEFT);
text("Showing data from text file; use mouse to drag items", 14, 14);
// show words
drawWords();
// for dragging:
if (hold && holdItem!=null) {
holdItem.x += mouseX-pmouseX;
holdItem.y += mouseY-pmouseY;
fill(255, 0, 0);
text(holdItem.x+","+holdItem.y, width-100, 16);
}
}//func
// -------------------------------------------------------
void drawWords() {
for (DataEntry item : dataList) {
item.display();
}
}
void loadData() {
Table table;
// "header" indicates the file has header row. The size of the array
// is then determined by the number of rows in the table.
table = loadTable("data.csv", "header");
if (table==null) {
println ("couldn't find file. Program ends here. Read comments in the sketch.\n");
exit();
return;
}
dataList = new DataEntry[table.getRowCount()];
for (int i = 0; i<table.getRowCount(); i++) {
// Iterate over all the rows in a table.
TableRow row = table.getRow(i);
// Access the fields via their column name (or index).
float x = row.getFloat("x");
float y = row.getFloat("y");
float d = row.getFloat("diameter");
String n = row.getString("name");
// Make a DataEntry object out of the data from each row.
dataList[i] = new DataEntry(x, y, d, n);
}
}
// -----------------------------------------------------------
void mousePressed() {
// start dragging
hold=true;
for (DataEntry item : dataList)
if (item.over()) {
holdItem=item;
return;
}
}
void mouseReleased() {
// stop dragging
// reset
hold=false;
holdItem=null;
}
// ========================================================================
// This simple DataEntry class draws a circle to the window
// and displays a text label
class DataEntry {
float x, y;
float diameter;
String name;
// boolean over = false;
// Create the DataEntry (constructor)
DataEntry(
float tempX, float tempY,
float tempD,
String s) {
x = tempX;
y = tempY;
diameter = tempD;
name = s;
} // (constructor)
// Display the DataEntry
void display() {
stroke(0);
if (over())
stroke(255, 0, 0);
strokeWeight(2);
noFill();
ellipse(x, y, diameter, diameter);
fill(0);
textAlign(CENTER);
text(name, x, y+diameter/2+20);
textAlign(LEFT);
}
boolean over() {
return
dist(mouseX, mouseY, x, y) < diameter+3;
}
//
}//class
//
data content:
x,y,diameter,name
112,122,22,Boy
212,222,132,Girl
312,322,12,Fred
Example 3
This is the example I provided the Link to above
It uses 2 String arrays in the code, but you can rewrite it using 2 tables
// https://discourse.processing.org/t/how-to-add-values-to-array-based-on-condition-read-two-files/28340
ArrayList<City> cities = new ArrayList();
ArrayList<Migration> migrations = new ArrayList();
String[] countryData =
{
"country,population",
"countryA,100000",
"countryB,200000",
"countryC,300000"
};
String[] migData =
{
"country_origin,country_dest,mig1990,mig1995,mig2000,mig2005",
"countryA,countryB,100,100,100,100",
"countryA,countryC,200,200,200,200",
"countryB,countryA,300,300,300,300",
"countryB,countryC,400,400,400,400"
};
void setup() {
size(1660, 860);
background(111);
// read data
for (String stringOneLineCity : countryData) {
String[] sLineParts=split(stringOneLineCity, ",");
if (!sLineParts[1].equals("population")) {
City newCity = new City (sLineParts[0], sLineParts[1]);
cities.add(newCity);
}//if
}//for
// read data
for (String stringOneLineMigration : migData) {
String[] sLineParts=split(stringOneLineMigration, ",");
int from = getCity(sLineParts[0]);
int to = getCity(sLineParts[1]);
if ( ! (from == -1 || to == -1) ) {
Migration newMigration = new Migration (from, to,
sLineParts[2], sLineParts[3],
sLineParts[4], sLineParts[5] );
migrations.add(newMigration);
}//if
}//for
}//func
void draw() {
background(111);
// display 1
for (City c : cities) {
c.display();
}
// display 2
for (Migration m : migrations) {
m.display();
}
}//func
int getCity(String c_) {
// returns the index of a city in the ArrayList cities
// based on the name of the city
int i=0;
for (City c : cities) {
if (c.name.equals(c_))
return i;
i++;
}
println("getCity failed with "
+c_);
return -1;
}
// ==================================================================================
class City {
float posx=random(100, width-100),
posy=random(100, height-100);
String name="";
int pop=0;
color col=color(random(255), random(255), random(255) );
//constr
City(String name_, String pop_) {
name=name_;
pop=int(pop_);
}//constr
void display() {
//
strokeWeight(1);
fill(col);
ellipse(posx, posy,
pop/1000, pop/1000);
}//
//
}//class
// ==================================================================================
class Migration {
int indexFromCity;
int indexToCity;
String[] migData;
//constr
Migration(int from, int to,
String... vals) {
//
indexFromCity=from;
indexToCity=to;
migData = vals;
}//constr
void display() {
City city1 = cities.get(indexFromCity);
City city2 = cities.get(indexToCity);
stroke(0);
strokeWeight(map(int(migData[0]),
0, 400, 1, 15) );
line(city1.posx, city1.posy,
city2.posx, city2.posy);
//reset
strokeWeight(1);
}
//
}//class
//
I am not sure I understand this.
Do you have data like with trends what kind of cloths were sold in january, february, march,
eg. january black shoes 100, january white shirts 399… and so on?
Sorry, I am not familiar with fashion trends and the implications.
Resources
Did you check out The 30 Best Data Visualizations of 2023 [Examples]
and Visualization (graphics) - Wikipedia
Chrisir