FORM+CODE In Design, Art, and Architecture by Casey Reas, Chandler McWilliams, and LUST

Visualize: LOADING AND DISPLAYING DATA

This example loads, parses, and visualizes text files from Project Gutenberg, a massive online collection of electronic books. The images on this page show the program’s analysis of two books side by side: Mary Shelley’s Frankenstein and Bram Stoker’s Dracula. The size of each word correlates to the number of times it is used in the book. In some language analysis programs, the words most frequently used in English, the articles and pronouns, are not included in the visualization because they are too common.

The program loads a book one line at a time and splits each line into individual words. For each word, it checks if it is new or if it has already been used in the text. If the word is new, the program adds it to a growing list. If it is already in the list, the program adds to the tally of how many times it has been used. After the entire book is read, the program sorts the list by the number of times each word was used.


/**
 * Visualize: Loading and Displaying Data
 * from Form+Code in Design, Art, and Architecture 
 * by Casey Reas, Chandler McWilliams, and LUST
 * Princeton Architectural Press, 2010
 * ISBN 9781568989372
 * 
 * This code was written for Processing 1.2+
 * Get Processing at http://www.processing.org/download
 */


Word[] frankList = new Word[1];
Word[] dracuList = new Word[1];

void setup() {
  size(800, 600);
  background(0);

  // Order the words from Frankenstein and Dracula according to frequency
  frankList = countAndOrderWords("84.txt", frankList);  // Frankenstein
  dracuList = countAndOrderWords("345.txt", dracuList);  // Dracula 

  int numWords = 200;
  int maxSize = 100;
  int wordHeight = 30;
  PFont font = createFont("Monospaced", wordHeight);
  textFont(font);

  float y = maxSize * 0.75;
  int x = 0;
  float maxHeight = 0;
  float ascent = 0;
  float descent = 0;
  
  float exponent = 0.60;

  float nextHeight = maxSize;
  textSize(nextHeight);
  for (int i = 0; i < numWords; i++) {
    if (x == 0) {
      text(frankList[i].ww.toUpperCase(), x, y);
      x += textWidth(frankList[i].ww);
    } else {
      text(frankList[i].ww.toUpperCase(), x, y);
      x += textWidth(frankList[i].ww);
    }

    nextHeight = frankList[i+1].count / float(frankList[0].count);
    nextHeight = pow(nextHeight, exponent);
    nextHeight = nextHeight * maxSize;
    textSize(nextHeight);
    x += textWidth(" ") * 0.75; 
    
    if ((x + textWidth(frankList[i+1].ww + " ")) > width) {
      x = 0; 
      ascent = textAscent();
      descent = textDescent();
      y += ascent + descent * .75;
    }
  }
  
  float ratio = frankList[0].count / float(dracuList[0].count);

  x = 0;
  y = height/2 + maxSize/2;
  
  nextHeight = maxSize;
  textSize(nextHeight);
  
  for (int i = 0; i < numWords; i++) {
    if (x == 0) {
      text(dracuList[i].ww.toUpperCase(), x, y);
      x += textWidth(dracuList[i].ww);
    } else {
      text(dracuList[i].ww.toUpperCase(), x, y);
      x += textWidth(dracuList[i].ww);
    }

    nextHeight = dracuList[i+1].count / float(dracuList[0].count);
    nextHeight = pow(nextHeight, exponent);
    nextHeight = nextHeight * maxSize;
    textSize(nextHeight);
    x += textWidth(" ") * 0.75; 
    
    if ((x + textWidth(dracuList[i+1].ww + " ")) > width) {
      x = 0; 
      ascent = textAscent();
      descent = textDescent();
      y += ascent + descent * .75;
    }
  }

}


Word[] countAndOrderWords(String textFile, Word[] wordList) {

  String[] lines = loadStrings(textFile);
  wordList[0] = new Word("");
  boolean started = false;

  for (int i = 0; i < lines.length; i++) {
    if (lines[i].startsWith("*** START OF")) {  
      started = true;
    } 
    else if (lines[i].startsWith("*** END")) {
      started = false;
    } 
    else if (started == true) {
      String separators = WHITESPACE + ",;.:!?()\"-";
      String[] thisLine = splitTokens(lines[i], separators);

      for (int j = 0; j < thisLine.length; j++) {

        String word = thisLine[j].toLowerCase();

        boolean newWord = true;

        for (int w = 0; w < wordList.length; w++) {
          if (word.equals(wordList[w].ww)) {
            newWord = false;
            wordList[w].count++;
            break;
          }
        }

        if (newWord == true) {
          Word next = new Word(word);
          wordList = (Word[])append(wordList, next);
          wordList[wordList.length-1].wordCount = word.length();
        }

      }
    }
  }

  Arrays.sort(wordList); 
  return wordList;
}


// ---------------
// Word.pde
// ---------------
class Word implements Comparable {

  String ww;
  int count = 1;
  int wordCount = 0;

  Word(String txt) {
    ww = txt;
  }

  // If we want to sort based on the count value of Word:
  int compareTo(Object o)
  {
    Word other = (Word)o;
    if(other.count > count) {  
      return 1;
    }
    if(other.count == count) {
      return 0;
    } else {
      return -1;
    }
  }
}

Contributed Examples

OpenFrameworks

view

/**
 * Visualize: Data from Form+Code in Design, Art, and Architecture 
 * implemented in OpenFrameworks by Anthony Stellato <http://rabbitattack.com/> 
 * 
 * Requires OpenFrameworks available at http://openframeworks.cc/
 * 
 * For more information about Form+Code visit http://formandcode.com
 */

// ===========================================================
// - Visualize_Data.h
// ===========================================================
#include "ofMain.h"
#include <fstream>
#include <sstream>
#include <cctype>
#include <string>

class Word {
public:
  string ww;
  int count;
  int wordCount;
  
  Word(){};
  Word(string txt);
  int compareTo(Word o);
};

class testApp : public ofBaseApp{

  public:
    void setup();
    void update();
    void draw();
    void countAndOrderWords( string textFile, vector<Word> *wordList);
    vector<string> tokenizeString(string & str,string & delims);
    string removePunctuation(string& my_input);
  
    vector<Word> frankList, dracuList;
    ofTrueTypeFont liberation;
};


// ===========================================================
// - Visualize_Data.cpp
// ===========================================================
#include "Visualize_Data.h"

bool compareWords(const Word &one, const Word &two){
  return one.count > two.count;
}

int numWords = 175;
int maximumSize = 85;
int wordHeight = 30;
float y = maximumSize * 0.75;
int x = 0;
float maxHeight = 0;
float ascent = 0;
float descent = 0;
float exponent = 0.60;

//--------------------------------------------------------------
void testApp::setup(){
  ofSetFrameRate(1);
  
  float time = ofGetElapsedTimef();
  countAndOrderWords("84.txt", &frankList);
  cout<<"frankList done.\n";
  float dur = ofGetElapsedTimef() - time;
  cout<<"took "<<dur<<" seconds.\n";
  time = ofGetElapsedTimef();
  countAndOrderWords("345.txt", &dracuList);
  cout<<"dracuList done.\n";
  dur = ofGetElapsedTimef() - time;
  cout<<"took "<<dur<<" seconds.\n";
  
  liberation.loadFont("LiberationMono-Regular.ttf", 24);
}

//--------------------------------------------------------------
void testApp::countAndOrderWords(string textFile, vector<Word> *wordList){

  bool started = false;
  size_t foundBegin, foundEnd;
  ifstream fin;
  fin.open( ofToDataPath(textFile).c_str() );
  while(fin!=NULL)
  {
    string line;
    getline(fin, line, '\n');
    foundBegin = line.find("*** START OF");
    foundEnd = line.find("*** END");
    if(foundBegin!=string::npos){
      started = true;
    } else if(foundEnd!=string::npos){
      started = false;
    } else if(started){
      string punct = " ,;:.!?()\"-";
      vector<string> words = tokenizeString(line, punct);
      for(vector<string>::iterator iter = words.begin(); iter != words.end(); ++iter){
        string word = removePunctuation(*iter);
        if(word.length() == 0){
          break;
        }else{
          transform(word.begin(), word.end(), word.begin(), ::tolower);
          bool newWord = true;
          for(vector<Word>::iterator w = wordList->begin(); w != wordList->end(); ++w){
            if(w->ww.compare(word) == 0){
              newWord = false;
              w->count++;
              break;
            }
          }

          if(newWord == true){
            Word next = Word(word);
            next.wordCount = word.length();
            wordList->push_back(next);
          }
        }
      }
    }
  }
  
  sort(wordList->begin(), wordList->end(), compareWords);
}

//--------------------------------------------------------------
// based on code from rosettacode.org
vector<string> testApp::tokenizeString(string & str,string & delims)
{
  string::size_type lastPos = str.find_first_not_of(delims, 0);
  string::size_type pos     = str.find_first_of(delims, lastPos);
  
  vector<string> tokens;
  
  while (string::npos != pos || string::npos != lastPos)
    {
    tokens.push_back(str.substr(lastPos, pos - lastPos));
    lastPos = str.find_first_not_of(delims, pos);
    pos     = str.find_first_of(delims, lastPos);
    }
  
  return tokens;
}

//--------------------------------------------------------------
string testApp::removePunctuation(string& my_input)
{
  for(int i=0; i < my_input.length(); i++)
  {
    if(!isalpha(my_input.at(i))){
      my_input.erase(i, 1);
    }
  }
  return my_input;
}

//--------------------------------------------------------------
void testApp::update(){

}

//--------------------------------------------------------------
void testApp::draw(){
  ofBackground(0, 0, 0);
  ofSetColor(255, 255, 255);
  
  float nextHeight = maximumSize;
  x = 0;
  y = maximumSize;
  
  liberation.loadFont("LiberationMono-Regular.ttf", nextHeight);
  
  for( int i = 0; i < numWords; i++){
    if( x == 0 ){
      liberation.drawString(dracuList[i].ww, x, y);
      x += liberation.stringWidth(dracuList[i].ww);
    } else {
      liberation.drawString(dracuList[i].ww, x, y);
      x += liberation.stringWidth(dracuList[i].ww);
    }
    nextHeight = dracuList[i+1].count / float(dracuList[0].count);
    nextHeight = pow(nextHeight, exponent);
    nextHeight = nextHeight * maximumSize;
    liberation.loadFont("LiberationMono-Regular.ttf", nextHeight);
    x += liberation.stringWidth("l") * .75f;
    
    if( (x + liberation.stringWidth(dracuList[i+1].ww + "l") ) > ofGetWidth()){
      x = 0;
      y += liberation.stringHeight("!llpyzzm_") * .75f;
    }
  }
  
  float ratio = dracuList[0].count / float(frankList[0].count);
  
  x = 0;
  y = ofGetHeight()/2 + maximumSize;
  
  nextHeight = maximumSize;
  liberation.loadFont("LiberationMono-Regular.ttf", nextHeight);
  
  for( int i = 0; i < numWords; i++){
    if( x == 0 ){
      liberation.drawString(frankList[i].ww, x, y);
      x += liberation.stringWidth(frankList[i].ww);
    } else {
      liberation.drawString(frankList[i].ww, x, y);
      x += liberation.stringWidth(frankList[i].ww);
    }
    nextHeight = frankList[i+1].count / float(frankList[0].count);
    nextHeight = pow(nextHeight, exponent);
    nextHeight = nextHeight * maximumSize;
    liberation.loadFont("LiberationMono-Regular.ttf", nextHeight);
    x += liberation.stringWidth("l") * .75f;
    
    if( (x + liberation.stringWidth(frankList[i+1].ww + "l") ) > ofGetWidth()){
      x = 0;
      y += liberation.stringHeight("!llpyzzm_") * .75f;
    }
  }
}

Word::Word(string txt){
  ww = txt;
  count = 1;
  wordCount = 0;
}

int Word::compareTo(Word o){
  if(o.count > this->count ){
    return 1;
  }
  if(o.count == this->count ){
    return 0;
  } else {
    return -1;
  }
}

DOWNLOAD ALL CODE EXAMPLES

We are looking for implementations of the code examples in other programming languages to post on the site. If you would like to submit a sample, or if you find a bug, please write to

FORM+CODE in Design, Art, and Architecture

Visualize: LOADING AND DISPLAYING DATA

Contributed Examples

OpenFrameworks