HELP with scatter data plot?

Programming Questions

kevintdame

in Programming Questions • 1 year ago

Hi. I'm trying to do something fairly simply: a XY scatter plot of data. The data is appearing properly but I have 2 questions:

1. any way to make the data appear faster? It takes a while for it all to appear

2. ultimately I want the user to be able to select a team (team affiliation is one of the data elements) and see the plot points associated with that team appear in a different color. I inserted a statement (line 28) as a test - to see if all data points associated with the team "BOS" would appear a different color - but it didn't work.

Any help would be appreciated! Thanks!

Kevin

String [] lines;
int index = 0;
int T = 2; //cell location in data file for team
int N = 1; //cell location in data file for name
int A = 3; //cell location in data file for age
int W = 5; //cell location in data file for WAR
int ColorR;
int ColorG;
int ColorB;
void setup() {
size(1280, 760);
PFont font = loadFont("HelveticaNeue-Light-20.vlw");
textFont(font);
lines = loadStrings("PlayerWAR.txt");
}
public void draw() {
if (index <lines.length) {
String[] pieces = split(lines[index], '\t');
float age = float(pieces[A]);
float WAR = float(pieces[W]);
String team = pieces[T];
String name = pieces[N];
float buffer = random(0,1);
float adjWAR=(WAR*100);
float adjage=50+(((age+buffer)-19)*20);
if (pieces[T]=="BOS") {
ColorR=247;
ColorG=82;
ColorB=33;
}
else
ColorR=150;
ColorG=150;
ColorB=150;
smooth();
strokeWeight(1);
stroke(100);
fill(ColorR,ColorG,ColorB);
ellipse(adjWAR,adjage,5,5);
index = index +1;
}
}

Replies(4)

amnon.owed

Re: HELP with scatter data plot?

1 year ago

Ad 1. It takes a while, because you only process and display 1 line per frame. So it will take as many frames as you have lines, before all are displayed. To change this, you can display all the lines, instead of just one.

Ad 2. To compare Strings use equals (see the forum, it's a FAQ).

Something else. If you want an interactive application, my advice is to do more of the data parsing in setup(). Currently it's done in draw(), but this is inefficient, because you should only do it once, instead of over and over again. In my adapted code I used noLoop(), but if you actually want to use draw() it may be better to either use arrays or a simple class to store the incoming data. That way displaying and interacting with it becomes easier.

Adapted Code

String [] lines;
int T = 2; //cell location in data file for team
int N = 1; //cell location in data file for name
int A = 3; //cell location in data file for age
int W = 5; //cell location in data file for WAR
void setup() {
size(1280, 760);
lines = loadStrings("PlayerWAR.txt");
PFont font = loadFont("HelveticaNeue-Light-20.vlw");
textFont(font);
stroke(100);
smooth();
noLoop();
}
void draw() {
background(0);
for (int i=0; i<lines.length; i++) {
String[] pieces = split(lines[i], '\t');
float age = float(pieces[A]);
float WAR = float(pieces[W]);
String team = pieces[T];
String name = pieces[N];
float buffer = random(0, 1);
float adjWAR=(WAR*100);
float adjage=50+(((age+buffer)-19)*20);
if (pieces[T].equals("BOS")) {
fill(247, 82, 33);
} else {
fill(150);
}
ellipse(adjWAR, adjage, 5, 5);
}
}

kevintdame

Re: HELP with scatter data plot?

1 year ago

Thanks. Extremely helpful. Another question I forgot to ask: is it possible to use a roll-over function to provide the name (and other data) for an individual data point? In other words I'd like to be able to mouse over a circle and have the data appear somewhere on the screen. I found some code in the forum that showed how to use a roll-over to, say, change the color of a circle when you mouse over it. But that code seemed to work for one circle, not hundreds. Any suggestions? Thanks Kevin

benja

Re: HELP with scatter data plot?

1 year ago

I think there is no big difference when having morge circles, you only have to decide whhat should happen, if two circles are ate the same position and can be hovered both at the same time. Here is a short example with circles and mouse-over.
The id of the circles is displayed when you move the mouse over it;

Circle[] circles;
int numCircles = 100;
PFont font;

void setup() {
size(500, 500);
font = createFont("Arial", 32);
textFont(font);
smooth();

// create circles
circles = new Circle[numCircles];
for (int i = 0; i< numCircles; i++) {
    circles[i] = new Circle(random(width), random(height), i);
}
}
void draw() {
background(0);
for (int i = 0; i< numCircles; i++) {
    circles[i].display();

    if (circles[i].isOver()) {
      text(circles[i].id, 10, 30);
    }
}
}

class Circle {
int id;
float x, y, rad;

Circle(float x, float y, int id) {
    this.id = id;
    this.x = x;
    this.y = y;
    rad = random(4, 10);
}

void display() {
    ellipse(x, y, 2*rad, 2*rad);
}

boolean isOver() {
    float dist = sqrt(sq(mouseX - x) + sq(mouseY-y));
    if (dist<=rad) {
      return true;
    }
    else {
      return false;
    }
}
}

kevintdame

Re: HELP with scatter data plot?

1 year ago

Thanks. I'll try that. Back to your earlier post and help with the noLoop command. I've added a controlP5 library that I've used in other applets to enable me to use a drop down menu for the user to choose the team (which would drive which circles to highlight, and which custom team color to use). The noLoop command seemed to be preventing the drop down menu from working, so I added a // in front of that command to deactivate it. Problem is the circles get drawn over and over again, creating a weird movement in the circles. Any advice on where to add the no loop command and still have the drop down menu work? Thanks!

import controlP5.*;
public ControlP5 cp5;
String currentTeam = "";
String team = "";
String fullteam = "";
// VARIABLES FOR CELL LOCATIONS. NOTE BLANK CELLS IN SPREADSHEET DON'T COUNT.
int T = 2; //cell location in data file for team
int N = 1; //cell location in data file for name
int A = 3; //cell location in data file for age
int W = 5; //cell location in data file for WAR
String listName = "";
// int selectedLeague=0;
void setup() {
size(1280, 760);
lines = loadStrings("PlayerWAR.txt");
PFont font = loadFont("HelveticaNeue-Light-20.vlw");
textFont(font);
smooth();
//noLoop();
cp5 = new ControlP5(this);
cp5.setControlFont(new ControlFont(createFont("HelveticaNeue-Light-20.vlw", 11), 11));
cp5.getTab("default").setHeight(30).setLabel("AL");
cp5.addTab("NL").setHeight(30);
cp5.addTab("NL")
.setHeight(30)
.setColorBackground(color(r1, g1, b1))
.setColorForeground(color(r3, g3, b3))
//.setColorActive(color(r2, g2, b2));
.setColorActive(color(40));
cp5.addTab("default")
.setHeight(30)
.setColorBackground(color(r1, g1, b1))
.setColorForeground(color(r3, g3, b3))
// .setColorActive(color(r2, g2, b2));
.setColorActive(color(40));
cp5.getWindow().setPositionOfTabs(1120, 44);
DropdownList teamAL = cp5.addDropdownList("AL").setPosition(1170, 75).setSize(100, 600);
DropdownList teamNL = cp5.addDropdownList("NL").setPosition(1170, 75).setSize(100, 600).moveTo("NL");
String[] ALteamNames = {
"BAL", "BOS", "CHW", "CLE", "DET", "KAN", "LAA",
"MIN", "NYY", "OAK", "SEA", "TAM", "TEX", "TOR"
};
String[] NLteamNames = {
"ARI", "ATL", "CHI", "CIN", "COL", "HOU",
"LAD", "MIA", "MIL", "NYM", "PHI", "PIT", "SD", "SF", "STL", "WSH"
};
for (int i=0; i<ALteamNames.length; i++) {
teamAL.addItem(ALteamNames[i], i);
}
for (int i=0; i<NLteamNames.length; i++) {
teamNL.addItem(NLteamNames[i], i);
}
customize(teamAL);
customize(teamNL);
}
// TEAM COLORS
int TeamColorR=30;
int TeamColorG=30;
int TeamColorB=30;
int TeamColor2R=30;
int TeamColor2G=30;
int TeamColor2B=30;
// background color
int r1=30;
int g1=30;
int b1=30;
// base text color
int r5=45;
int g5=45;
int b5=45;
// orange
int r2=232;
int g2=88;
int b2=1;
//dark gray
int r3=55;
int g3=55;
int b3=55;
// red
int r4=255;
int g4=0;
int b4=0;
String[] lines;
int selectedLeague = 0;
boolean TeamFound = false;
void draw() {
// background(250);
background (r1, g1, b1);
if (currentTeam=="BAL") {
selectedLeague=1;
fullteam = "BALTIMORE ORIOLES";
TeamColorR=247;
TeamColorG=82;
TeamColorB=33;
TeamColor2R=0;
TeamColor2G=0;
TeamColor2B=0;
}
else if (currentTeam=="BOS") {
selectedLeague=1;
fullteam = "BOSTON RED SOX";
TeamColorR=238;
TeamColorG=23;
TeamColorB=31;
TeamColor2R=27;
TeamColor2G=39;
TeamColor2B=63;
}
else if (currentTeam=="CHW") {
selectedLeague=1;
fullteam = "CHICAGO WHITE SOX";
TeamColorR=150;
TeamColorG=150;
TeamColorB=150;
TeamColor2R=0;
TeamColor2G=0;
TeamColor2B=0;
}
else if (currentTeam=="CLE") {
selectedLeague=1;
fullteam = "CLEVELAND INDIANS";
TeamColorR=238;
TeamColorG=23;
TeamColorB=31;
TeamColor2R=27;
TeamColor2G=39;
TeamColor2B=63;
}
else if (currentTeam=="DET") {
selectedLeague=1;
fullteam = "DETROIT TIGERS";
TeamColorR=247;
TeamColorG=82;
TeamColorB=33;
TeamColor2R=27;
TeamColor2G=39;
TeamColor2B=63;
}
else if (currentTeam=="KAN") {
selectedLeague=1;
fullteam = "KANSAS CITY ROYALS";
TeamColorR=0;
TeamColorG=132;
TeamColorB=200;
TeamColor2R=255;
TeamColor2G=255;
TeamColor2B=255;
}
else if (currentTeam=="LAA") {
selectedLeague=1;
fullteam = "LA ANGELS OF ANAHEIM";
TeamColorR=238;
TeamColorG=23;
TeamColorB=31;
TeamColor2R=255;
TeamColor2G=255;
TeamColor2B=255;
}
else if (currentTeam=="MIN") {
selectedLeague=1;
fullteam = "MINNESOTA TWINS";
TeamColorR=238;
TeamColorG=23;
TeamColorB=31;
TeamColor2R=27;
TeamColor2G=39;
TeamColor2B=63;
}
else if (currentTeam=="NYY") {
selectedLeague=1;
fullteam = "NEW YORK YANKEES";
TeamColorR=150;
TeamColorG=150;
TeamColorB=150;
TeamColor2R=27;
TeamColor2G=39;
TeamColor2B=63;
}
else if (currentTeam=="OAK") {
selectedLeague=1;
fullteam = "OAKLAND ATHLETICS";
TeamColorR=253;
TeamColorG=158;
TeamColorB=4;
TeamColor2R=27;
TeamColor2G=66;
TeamColor2B=11;
}
else if (currentTeam=="SEA") {
selectedLeague=1;
fullteam = "SEATTLE MARINERS";
TeamColorR=20;
TeamColorG=119;
TeamColorB=125;
TeamColor2R=27;
TeamColor2G=39;
TeamColor2B=63;
}
else if (currentTeam=="TAM") {
selectedLeague=1;
fullteam = "TAMPA BAY RAYS";
TeamColorR=106;
TeamColorG=164;
TeamColorB=202;
TeamColor2R=255;
TeamColor2G=255;
TeamColor2B=255;
}
else if (currentTeam=="TEX") {
selectedLeague=1;
fullteam = "TEXAS RANGERS";
TeamColorR=238;
TeamColorG=23;
TeamColorB=31;
TeamColor2R=27;
TeamColor2G=39;
TeamColor2B=63;
}
else if (currentTeam=="TOR") {
selectedLeague=1;
fullteam = "TORONTO BLUE JAYS";
TeamColorR=0;
TeamColorG=132;
TeamColorB=200;
TeamColor2R=255;
TeamColor2G=255;
TeamColor2B=255;
}
else if (currentTeam=="ARI") {
selectedLeague=2;
fullteam = "ARIZONA DIAMONDBACKS";
TeamColorR=238;
TeamColorG=23;
TeamColorB=31;
TeamColor2R=0;
TeamColor2G=0;
TeamColor2B=0;
}
else if (currentTeam=="ATL") {
selectedLeague=2;
fullteam = "ATLANTA BRAVES ";
TeamColorR=238;
TeamColorG=23;
TeamColorB=31;
TeamColor2R=33;
TeamColor2G=65;
TeamColor2B=106;
}
else if (currentTeam=="CHI") {
selectedLeague=2;
fullteam = "CHICAGO CUBS ";
TeamColorR=0;
TeamColorG=84;
TeamColorB=130;
TeamColor2R=252;
TeamColor2G=45;
TeamColor2B=3;
}
else if (currentTeam=="CIN") {
selectedLeague=2;
fullteam = "CINCINNATI REDS ";
TeamColorR=238;
TeamColorG=23;
TeamColorB=31;
TeamColor2R=255;
TeamColor2G=255;
TeamColor2B=255;
}
else if (currentTeam=="COL") {
selectedLeague=2;
fullteam = "COLORADO ROCKIES ";
TeamColorR=77;
TeamColorG=68;
TeamColorB=128;
TeamColor2R=255;
TeamColor2G=255;
TeamColor2B=255;
}
else if (currentTeam=="HOU") {
selectedLeague=2;
fullteam = "HOUSTON ASTROS ";
TeamColorR=177;
TeamColorG=35;
TeamColorB=23;
TeamColor2R=0;
TeamColor2G=0;
TeamColor2B=0;
}
else if (currentTeam=="LAD") {
selectedLeague=2;
fullteam = "LOS ANGELES DODGERS ";
TeamColorR=0;
TeamColorG=132;
TeamColorB=200;
TeamColor2R=255;
TeamColor2G=255;
TeamColor2B=255;
}
else if (currentTeam=="MIA") {
selectedLeague=2;
fullteam = "MIAMI MARLINS ";
TeamColorR=247;
TeamColorG=82;
TeamColorB=33;
TeamColor2R=33;
TeamColor2G=65;
TeamColor2B=106;
}
else if (currentTeam=="MIL") {
selectedLeague=2;
fullteam = "MILWAUKE BREWERS ";
//banner and bar (lighter color)
TeamColorR=179;
TeamColorG=134;
TeamColorB=66;
//text in banner
TeamColor2R=5;
TeamColor2G=18;
TeamColor2B=73;
}
else if (currentTeam=="NYM") {
selectedLeague=2;
fullteam = "NEW YORK METS ";
TeamColorR=0;
TeamColorG=84;
TeamColorB=130;
TeamColor2R=247;
TeamColor2G=82;
TeamColor2B=33;
}
else if (currentTeam=="PHI") {
selectedLeague=2;
fullteam = "PHILADELPHIA PHILLIES ";
TeamColorR=238;
TeamColorG=23;
TeamColorB=31;
TeamColor2R=255;
TeamColor2G=255;
TeamColor2B=255;
}
else if (currentTeam=="PIT") {
selectedLeague=2;
fullteam = "PITTSBURG PIRATES ";
//banner and bar (lighter color)
TeamColorR=253;
TeamColorG=158;
TeamColorB=4;
//text in banner
TeamColor2R=0;
TeamColor2G=0;
TeamColor2B=0;
}
else if (currentTeam=="SD") {
selectedLeague=2;
fullteam = "SAN DIEGO PADRES ";
//banner and bar (lighter color)
TeamColorR=2;
TeamColorG=56;
TeamColorB=100;
//text in banner
TeamColor2R=255;
TeamColor2G=255;
TeamColor2B=255;
}
else if (currentTeam=="SF") {
selectedLeague=2;
fullteam = "SAN FRANCISCO GIANTS ";
//banner and bar (lighter color)
TeamColorR=247;
TeamColorG=82;
TeamColorB=33;
//text in banner
TeamColor2R=0;
TeamColor2G=0;
TeamColor2B=0;
}
else if (currentTeam=="STL") {
selectedLeague=2;
fullteam = "ST. LOUIS CARDINALS ";
TeamColorR=238;
TeamColorG=23;
TeamColorB=31;
TeamColor2R=27;
TeamColor2G=39;
TeamColor2B=63;
}
else if (currentTeam=="WSH") {
selectedLeague=2;
fullteam = "WASHINGTON NATIONALS ";
TeamColorR=238;
TeamColorG=23;
TeamColorB=31;
TeamColor2R=255;
TeamColor2G=255;
TeamColor2B=255;
}
fill(TeamColorR, TeamColorG, TeamColorB);
noStroke();
smooth();
beginShape();
vertex(20, 90);
vertex(295, 90);
vertex(285, 102);
vertex(300, 114);
vertex(20, 114);
vertex(30, 102);
endShape();
textAlign(CENTER);
textSize(16);
fill(TeamColor2R, TeamColor2G, TeamColor2B);
text(fullteam, 157.5, 109);
textAlign(LEFT);
fill(255);
smooth();
PImage logo;
logo = loadImage("rankometerlogo.jpg");
image(logo, 20, 25);
textSize(10);
textAlign(RIGHT);
text("Copyright", 1220, 675);
text("Kevin Dame", 1220, 685);
text("2012", 1220, 695);
float medianWAR=(3*100);
float medianAge=100+((49-28)*18);
fill(100);
line(50,medianAge,1200,medianAge);
line(medianWAR,100,medianWAR,700);
fill(100);
textSize(14);
text("young,bad", 150, 675);
text("young,good", 600, 675);
text("old,bad", 150, 100);
text("old,good", 600, 100);
if (selectedLeague==1) { //AMERICAN LEAGUE
for (int i=0; i<lines.length; i++) {
String[] pieces = split(lines[i], '\t');
float age = float(pieces[A]);
float WAR = float(pieces[W]);
String team = pieces[T];
String name = pieces[N];
float buffer = random(0, 1);
float adjWAR=50+(WAR*100);
float adjage=100+((49-(age+buffer))*18);
noStroke();
if (pieces[T].equals(currentTeam)) {
fill(247, 82, 33,150);
} else {
fill(150,150);
}
ellipse(adjWAR, adjage, 15, 15);
}
}
}
public void controlEvent(ControlEvent theEvent) {
if (theEvent.isGroup()) {
String listName = theEvent.getName();
String itemName = theEvent.getGroup().captionLabel().getText();
if (listName.equals("AL") || listName.equals("NL")) {
currentTeam = itemName;
}
}
}
public void customize(DropdownList ddl) {
ddl.setBackgroundColor(color(0));
ddl.setItemHeight(30);
ddl.setBarHeight(30);
ddl.setWidth(50);
ddl.captionLabel().style().marginTop = 6;
ddl.captionLabel().style().marginLeft = 3;
ddl.valueLabel().style().marginTop = 3;
ddl.setColorForeground(color(r3, g3, b3));
ddl.setColorBackground(color(40));
ddl.setColorActive(color(r3, g3, b3));
}

Top Reply