Quantcast
Channel: Library Questions - Processing 2.x and 3.x Forum
Viewing all articles
Browse latest Browse all 2896

Data Viz and MousePressed()

$
0
0

Hey everybody,

I'm working on my first data viz project based on chapter 3 of Ben Fry's Visualizing Data book.

I have a map of the US states with different sized ellipses drawn for data in each state.

I am trying to figure out how when the mouse is pressed I can change the size and colour of the ellipses and also introduce some audio.

For this I have I have my sketch followed by void mousePressed(). This allows me to generate a duplicate image and also change the colour of the ellipses.

My problem at the moment is that I can't get the second image to 'stay' on the screen.I've tried with a global boolean variable but just can't get the code right!

And also although I am able to change the colour of the ellipses I am unable to make them expand over time.

Here is what I have so far, and suggestions appreciated

boolean button = false;
PImage mapImage;
PImage mapImage2;
Table locationTable;
int rowCount;
float index = 0;
Table dataTable;
float dataMin = MAX_FLOAT;
float dataMax = MIN_FLOAT;

void setup() {
  size(1280, 800);
  frameRate(10);
  //noLoop();
  mapImage = loadImage("bigmap.png");
  mapImage2 = loadImage("bigmap2.png");//


  // Make a data table from a file that contains
  // the coordinates of each state.
  locationTable = new Table("locations.tsv");

  // The row count will be used a lot, store it locally.
  rowCount = locationTable.getRowCount();//this reads each locations x,y valuses

  //read the data Table
  dataTable = new Table("random2.tsv");

  //find the minimum and maximum values
  for (int row = 0; row< rowCount; row++) {
    float value =dataTable.getFloat(row, 1);
    if (value>dataMax) {
      dataMax = value;
    }
    if (value< dataMin) {
      dataMin = value;
    }
  }
}

void draw() {
  background(0);
  image(mapImage, 0, 0);


  // Drawing attributes for the ellipses
  smooth();
  fill(255, 0, 0);
  noStroke();

  // Loop through the rows of the locations file and draw the points
  for (int row = 0; row < rowCount; row++) {
    String abbrev = dataTable.getRowName(row);  // column 1
    float x  = locationTable.getFloat(abbrev, 1);
    float y = locationTable.getFloat(abbrev, 2);  // column 2
    drawData (x, y, abbrev);
  }
}

//map the size of the elloipse to the data value
void drawData(float x, float y, String abbrev) {
  //get data value for state
  index = index+1;
  float value = dataTable.getFloat(abbrev, 1);
  //re-map the value to a number between 2 and 40
  float mapped = map(value, dataMin, dataMax, 4, 80);
  //draw and ellipse for this item


  ellipse(x*2, y*2, mapped, mapped);

  String s = " the murder rate of";
  String i = "is";
  //println(abbrev + value);
  println(s, abbrev, i, value);
}

void mousePressed() {

  button =! button;//not working
  image(mapImage2, 0, 0);
  println("image2works");


  // Drawing attributes for the ellipses
  smooth();
  fill( 0, 255, 0);
  noStroke();

  // Loop through the rows of the locations file and draw the points
  for (int row = 0; row < rowCount; row++) {
    String abbrev = dataTable.getRowName(row);  // column 1
    float x  = locationTable.getFloat(abbrev, 1);
    float y = locationTable.getFloat(abbrev, 2);  // column 2
    drawData2 (x, y, abbrev);
  }
}

//map the size of the ellipse to the data value
void drawData2(float x, float y, String abbrev) {
  //get data value for state
  float value2 = dataTable.getFloat(abbrev, 1);
  //re-map the value to a number between 2 and 40
  float mapped2 = map(value2, dataMin, dataMax, 4, 80);
  //draw and ellipse for this item
  mapped2= mapped2+ 1;
  // an attempt to make ellipses expand that doesn't work
  ellipse(x*2, y*2, mapped2, mapped2);
  println("duplicate works");
}

Viewing all articles
Browse latest Browse all 2896

Trending Articles