Drawing a cross chart visualization

yousufalin

I was trying to create a small diagram based on the data from a csv file. I created a two columns of data where the first column displays name of few drinks and objects, and the second column displays their color. I wanted to create a diagram as i drew in the concept sketch shown below.

Concept image

image showing the content inside the csv file

I was able to count and list down the repeating members in both the columns. But I am not able to create the connecting lines.

the code so far is as follows

String tag = "dataset.csv";
String []rawData;

IntDict drinks;
IntDict colors;

void setup() {
  size(600, 600);

  drinks = new IntDict();
  colors = new IntDict();

  rawData = loadStrings(tag);

  for (int i =0; i<rawData.length; i++) {
    String [] thisRow = split(rawData[i], ","); 

    //  drinks.increment(thisRow[1]);
    drinks.increment(thisRow[0]);
    colors.increment(thisRow[1]);
  }
  println(drinks);
  println(colors);

  String [] drinkName = drinks.keyArray();
  int [] drinkNo = drinks.valueArray();

  String [] colorName = colors.keyArray();
  int [] colorNo = colors.valueArray();

  for (int i = 0; i<drinkName.length; i++) {

    fill(0);
    textSize(15);
    text(drinkName[i]+":"+drinkNo[i], 100, 100+30*i);

    line(100, 100+30*i, 300, 100+30*i);
  }
  for (int i = 0; i<colorName.length; i++) {

    fill(0);
    textSize(15);
    text(colorName[i]+":"+colorNo[i], 300, 100+30*i);

  }

}

It would be great if someone can help me with this.

Many thanks in advance:)

Yousuf

GoToLoop

• I fail to see how your drinks map to their corresponding colors. :-?
• You should have some container which allows you to relate both together.
• You can use a HashMap for drinks: https://Processing.org/reference/HashMap.html
• And a StringList for colors: https://processing.org/reference/StringList.html
• Whole structure would be like this:

import java.util.Map;
final Map<String, StringList> drinks = new HashMap<String, StringList>();

GoToLoop

http://StackOverflow.com/questions/33160079/creating-a-rank-list-by-sorting-an-array
http://StackOverflow.com/questions/33200984/drawing-a-cross-chart-visualization-using-processing

yousufalin

@GoToLoop thank you for suggesting me to read hashmap and stringlist. i shall start with that. i must say ur previous suggestion to read about indDict was really helpful. :)

l posted the same questions in stackoverflow also to learn more and find answers :)

GoToLoop

// forum.processing.org/two/discussion/13096/drawing-a-cross-chart-visualization
// GoToLoop (2015-Oct-19)

static final String CSV_FILE = "dataset.cvs", CSV[] = {
  "coffee,black", 
  "cola,black", 
  "milk,white", 
  "cola,orange", 
  "bread,brown", 
  "chocolate,brown", 
  "cola,green", 
  "sugar,white"
};

import java.util.Map;
final Map<String, StringList> drinkMap = new HashMap<String, StringList>();

void setup() {
  size(600, 600);
  smooth(4);
  noLoop();

  getCSV();
  println(drinkMap);

  exit();
}

void getCSV() {
  String[] data = loadStrings(CSV_FILE);
  if (data == null)  data = CSV;

  drinkMap.clear();

  for (String row : data) {
    String[] cols = split(row, ',');
    String drink = cols[0], colour = cols[1];

    StringList colorList = drinkMap.get(drink);
    if (colorList == null)  drinkMap.put(drink, colorList = new StringList());

    colorList.append(colour);
  }
}

yousufalin

@GoToLoop thank you for the reply :)

I now have to study this as usual :)