Processing: New York Times Article Search API

Processing: New York Time Article Search API – Video of the program

Processing: New York Times Article Search API

Task:

Use the New York Times Article Search API and combine it with one of the examples of the Book „Generative Gestaltung“ to create an interactive display which can be used at an airport.

Description of the solution:

This interactive display uses some code of the example P_4_3_2_01 from the book „Generative Gestaltung“ and articles from the New York Times Article Search API by searching for the search term „Germany“ within two days before today and four days before today and order these articles by the newest. From these articles the program needs three things: the headline, the snippet (which is the first line of text of the article) and the image of the article.

The text (headline and snipped) is displayed with rotating and overlapping characters in the colours of the pixels of the image. These characters are rotating each randomly to create motion, which is used to attract the users attention. Moreover, the articles are changing by time.

If the user gets closer to the display (for now: press left arrow key), the suddenly rotation stops and the characters jump all to a position without overlapping each other any more so the text gets readable. Then the image cannot be recognized so well instead. If the user‘ goes away (for now: press right arrow key) it goes back to the overlapping and rotating characters again.

This can be nice and interesting for people who are waiting at an airport to overcome the waiting time for example on the gate.

Processing: New York Time Article Search API - First view when the program starts
Processing: New York Time Article Search API – First view when the program starts
Possible improvements:

As this is a first version of the idea, there are still some things that have to be rethought to improve the design of this program.

Now, when the user gets closer to the display, the characters are directly jumping to their new position without any transition. This was meant as a surprise. But the user might does not understand that the image before is made from the characters of the article and that it is an image from the article, because the change is too fast. Therefore, an improvement might be to add at least a little transition. This transition can be to first stop the rotation and bring their rotation back in their original angel as one step. The second step can then make the characters jump into the right position. That maybe makes it more obvious that the image is made with the characters of the article.

Another problem is the readability when a user is closer to the display. Sometimes it is hard to read because some parts of the images, where the colour of the characters comes from, have less contrast or the same colour as the background. To avoid this it might be necessary to change the colour of all letters to one colour instead of the images colours. That can be a third step of the transformation.

Processing-Code: New York Times Article Search API
// P_4_3_2_01.pde
// 
// Generative Gestaltung, ISBN: 978-3-87439-759-9
// First Edition, Hermann Schmidt, Mainz, 2009
// Hartmut Bohnacker, Benedikt Gross, Julia Laub, Claudius Lazzeroni
// Copyright 2009 Hartmut Bohnacker, Benedikt Gross, Julia Laub, Claudius Lazzeroni
//
// http://www.generative-gestaltung.de
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.

/**
 * pixel mapping. each pixel is translated into a new element (letter)
 * 
 * KEYS
 * arrow right/left  : near/close
 */

import processing.pdf.*;
import java.util.Calendar;
import http.requests.*;

String q, url, begin_date, end_date, sort, api_key;
String textLines, headline, snippet, image_path;

boolean savePDF = false;

float fontSizeMax = 20;
float fontSizeMin = 15;
float spacing = 6; // line height 12
float kerning = -3; // between letters 0.5

boolean fontSizeStatic = false;
boolean blackAndWhite = false;
boolean closeTo = false;

int seconds = second();
int articleNumber = 0;
int secoundCounter = 1;
int end_day;
int end_month;
int end_year;
int begin_day;
int begin_month;
int begin_year;

PFont normal;
PFont bold;
PImage img;

JSONObject response;

void setup() {

  size(1200, 800);
  smooth();

  normal = createFont("Arial", 10);
  bold = createFont("Arial Black", 10);

  // Specify Parameters
  api_key = "YOUR KEY"; //key
  url = "https://api.nytimes.com/svc/search/v2/articlesearch.json";
  String today = timestamp();
  end_day = /*31;*/ int(today.substring(4, 6))-2;
  end_month = /*10;*/ int(today.substring(2, 4));
  end_year = /*2018;*/ int("20" + today.substring(0, 2));
  if ((end_day - 2) <= 0) {
    if ((end_month - 1) <= 0) {
      begin_day = 29;
      begin_month = 12;
      begin_year = end_year - 1;
    } else {
      begin_day = 29;
      begin_month = end_month-1;
      begin_year = end_year;
    }
  } else {
    begin_day = end_day-2;
    begin_month = end_month;
    begin_year = end_year;
  }
  //begin_date = Integer.toString(begin_year) + Integer.toString(begin_month) + Integer.toString(begin_day); //eg. "20181001";
  begin_date = Integer.toString(begin_year) + String.format("%02d", begin_month) + String.format("%02d", begin_day); //eg. "20181001";
  println(begin_date);
  //end_date = Integer.toString(end_year) + Integer.toString(end_month) + Integer.toString(end_day); //eg. "20181031";
  end_date = Integer.toString(end_year) + String.format("%02d", end_month) + String.format("%02d", end_day); //eg. "20181031";
  println(end_date);
  sort = "newest";
  q = "Germany";

  // Specify HTTP-Request
  //GetRequest get = new GetRequest(url + "?" + "q=" + q + "&begin_date=" + begin_date + "&end_date=" + end_date + "&sort=" + sort);
  GetRequest get = new GetRequest(url + "?" + "q=" + q + "&begin_date=" + begin_date + "&end_date=" + end_date + "&sort=" + sort + "&api-key=" + api_key);
  //get.addHeader("api-key", api_key);
  // Send Request
  get.send();

  // Save response in JSON Object
  response = parseJSONObject(get.getContent());
  saveJSONObject(response, "nyt-test.json");

  // Get interesting informations
  headline = response.getJSONObject("response").getJSONArray("docs").getJSONObject(0).getJSONObject("headline").getString("main");
  snippet = response.getJSONObject("response").getJSONArray("docs").getJSONObject(0).getString("snippet");
  textLines = (headline + ": " + snippet);
  println(textLines);

  image_path = response.getJSONObject("response").getJSONArray("docs").getJSONObject(0).getJSONArray("multimedia").getJSONObject(0).getString("url");
  img = loadImage("https://www.nytimes.com/" + image_path);

  println(img.width+" x "+img.height);
}

void draw() {
  if (!closeTo) {
    if (int(frameCount/frameRate)%seconds==secoundCounter) {
    secoundCounter ++;
    if (articleNumber < (response.getJSONObject("response").getJSONArray("docs").size())-1) {
      articleNumber++;
    } else {
      articleNumber = 0;
    }
    if (response.getJSONObject("response").getJSONArray("docs").getJSONObject(articleNumber).getJSONArray("multimedia").size() > 0) {
      headline = response.getJSONObject("response").getJSONArray("docs").getJSONObject(articleNumber).getJSONObject("headline").getString("main");
      snippet = response.getJSONObject("response").getJSONArray("docs").getJSONObject(articleNumber).getString("snippet");
      textLines = (headline + ": " + snippet);
      image_path = response.getJSONObject("response").getJSONArray("docs").getJSONObject(articleNumber).getJSONArray("multimedia").getJSONObject(0).getString("url");
      img = loadImage("https://www.nytimes.com/" + image_path);
    } else {
      if (articleNumber < response.getJSONObject("response").getJSONArray("docs").size()-1) {
        articleNumber++;
      } else {
        articleNumber = 0;
      }
    }
  } 
  }

  if (!closeTo) {
    background(80);
  } else {
    background(255);
  }
  textAlign(LEFT);

  float x = 0, y = 10;
  int counter = 0;

  while (y < height) {
    // translate position (display) to position (image)
    int imgX = (int) map(x, 0, width, 0, img.width);
    int imgY = (int) map(y, 0, height, 0, img.height);
    // get current color
    color c = img.pixels[imgY*img.width+imgX];
    int greyscale = round(red(c)*0.222 + green(c)*0.707 + blue(c)*0.071);

    pushMatrix();
    translate(x, y);
    if (!closeTo) {
      rotate(PI/random(0, 10));
    }

    if (fontSizeStatic) {
      textFont(normal, fontSizeMax);
      if (blackAndWhite) fill(greyscale);
      else fill(c);
    } else {
      // greyscale to fontsize
      float fontSize = map(greyscale, 0, 255, fontSizeMax, fontSizeMin);
      fontSize = max(fontSize, 1);
      textFont(normal, fontSize);
      if (blackAndWhite) fill(0);
      else fill(c);
    } 

    char letter = textLines.charAt(counter);
    text(letter, 1, 0);
    float letterWidth = textWidth(letter)+ kerning;
    // for the next letter ... x + letter width
    x = x + letterWidth+1; // update x-coordinate
    popMatrix();

    // linebreaks
    if (x+letterWidth >= width) {
      x = 0;
      y = y + spacing; // add line height
    }

    counter++;
    if (counter > textLines.length()-1) counter = 0;
  }
  textFont(bold, 30);
  fill(255);
  rect(0, height-45, width, 45);
  fill(0);
  textAlign(CENTER);
  text(headline, width/2, height-10);

  if (savePDF) {
    savePDF = false;
    endRecord();
  }
}


void keyReleased() {
  
}

void keyPressed() {
  if (keyCode == LEFT) {
    spacing = fontSizeMax; // line height 12
    kerning = 0.5; // between letters 0.5
    closeTo = true;
  }

  if (keyCode == RIGHT) {
    spacing = 6; // line height 12
    kerning = -3; // between letters 0.5
    closeTo = false;
    seconds = second();
    secoundCounter = 1;
  }
}

// timestamp
String timestamp() {
  Calendar now = Calendar.getInstance();
  return String.format("%1$ty%1$tm%1$td_%1$tH%1$tM%1$tS", now);
}

Here you can download a ZIP-Folder with the complete program:

NYT_ArticleSearch – Processing-Program

R: Titanic

  • R: Titanic - All passengers
    R: Titanic - All passengers

R: Titanic

Task:

Show the data about how many people survived and how many people died at the Titanic. Use the data from a given file. This time show how it could look with Shiny in R to present it to the course.

Description of the solution:

I used pie charts to show the percentage of how many people survived and how many died. This infographic is interactive because you can select the passenger’s class, the sex and the age and combine different selections to get a result. Therefore, I divided the program into seven scripts, which can be seen below. Only the ui.R-Script is for the user interface. The other scripts are used for the function.

R-Code: Titanic
# ui.R
#Loading libraries
library(shiny)

#Loading other used scripts

# Define UI for application that draws a histogram
shinyUI(fluidPage(
  
  # Application title
  titlePanel("Titanic"),
  
  # The inout-fields 
  sidebarLayout(
    sidebarPanel(
      radioButtons("pclassIn", "Passenger's class:",
                   c("All" = "all",
                     "First class" = "first",
                     "Secound class" = "secound",
                     "Third class" = "third")),
      selectInput("sexIn", "Passenger's sex:",
                   c("all" = "all",
                     "female" = "female",
                     "male" = "male")),
      selectInput("ageIn",
                   "Passenger's age",
                   c("All" = "all",
                     "Children" = "children",
                     "Adults" = "adults"))
       
    ),
    
    # Show a plot of the generated distribution
    mainPanel(
       plotOutput("pieChart")
    )
  )
))
#server.R
#Loading libraries
# for Shiny
library(shiny)

#for csv
library(readr)
library(data.table)

#Loading other used scripts
source("scripts/pieChart.R")
source("scripts/passenger.R")
source("scripts/filterPassenger.R")
source("scripts/allPass.R")
source("scripts/getSlices.R")

# Loading Data
titanicData <- read.csv2("data/titanic.csv")
setnames(titanicData, old = "ï..pclass", new = "pclass")
countedPassenger <- filterPassenger(titanicData)
lbls <- c("survived", "not survived")

# Define server logic required to draw a histogram
shinyServer(function(input, output) {
   
  output$pieChart <- renderPlot({
    slices <- getSlices(countedPassenger, input)
    pieChart(slices, lbls)
  })
  
})
#allPass.R
allPass <- function(actuellPassenger, survivedAll, deadAll){
  # Survived or dead
  if(actuellPassenger$survived == 1) {
    survivedAll <- survivedAll + 1
  }
  
  if(actuellPassenger$survived == 0){
    deadAll <- deadAll + 1
  }
  
  allPassenger <- list("survived" = survivedAll, "dead" = deadAll)
  
  return(allPassenger)
}
# pieChart.R
# Source: https://www.statmethods.net/graphs/pie.html

pieChart <- function(slices , lbls){
  
  pct <- round(slices/sum(slices)*100)
  
  lbls <- paste(lbls, pct) # add percents to labels 
  
  lbls <- paste(lbls,"%",sep="") # ad % to labels 
  
  colors = c("green" ,"red")
  
  pie(slices,labels = lbls, col=colors,
      main="Pie Chart of Titanic")
}
# passenger.R
passenger <- function(titanicData, myRow){
  #print(titanicData$pclass[myRow])
  pclass <- titanicData$pclass[myRow]
  #pclass <- 1
  sex <- titanicData$sex[myRow]
  age <- titanicData$age[myRow]
  survived <- titanicData$survived[myRow]
  
  pass <- list("pclass" = pclass, "sex" = sex, "age" = age, "survived" = survived)
  return(pass)
}
# getSlices.R
getSlices <- function(countedPassenger, input){
  choiceClass <- input$pclassIn;
  choiceSex <- input$sexIn;
  choiceAge <- input$ageIn;
  sclices <- c(0,0);
  lbls <- c();
  
  #all
  if(choiceClass == "all" && choiceSex == "all" && choiceAge == "all"){
    slices <- c(countedPassenger$allPassenger$survived, countedPassenger$allPassenger$dead)
  }
  # class
  if(choiceClass != "all" && choiceSex == "all" && choiceAge == "all"){
    # first class
    if(choiceClass == "first"){
      slices <- c(countedPassenger$firstClassPassenger$survived, countedPassenger$firstClassPassenger$dead)
    }
    # secound class
    if(choiceClass == "secound"){
      slices <- c(countedPassenger$secoundClassPassenger$survived, countedPassenger$secoundClassPassenger$dead)
    }
    # third class
    if(choiceClass == "third"){
      slices <- c(countedPassenger$thirdClassPassenger$survived, countedPassenger$thirdClassPassenger$dead)
    }
  }
  
  # sex
  if(choiceClass == "all" && choiceSex != "all" && choiceAge == "all"){
    # female
    if(choiceSex == "female"){
      slices <- c(countedPassenger$femalePassenger$survived, countedPassenger$femalePassenger$dead)
    }
    # male
    if(choiceSex == "male"){
      slices <- c(countedPassenger$malePassenger$survived, countedPassenger$malePassenger$dead)
    }
  }
  
  # age
  if(choiceClass == "all" && choiceSex == "all" && choiceAge != "all"){
    # children
    if(choiceAge == "children"){
      slices <- c(countedPassenger$childPassenger$survived, countedPassenger$childPassenger$dead)
    }
    # adults
    if(choiceAge == "adults"){
      slices <- c(countedPassenger$adultPassenger$survived, countedPassenger$adultPassenger$dead)
    }
  }
  
  # class sex
  if(choiceClass != "all" && choiceSex != "all" && choiceAge == "all"){
    # first class female
    if(choiceClass == "first" && choiceSex == "female"){
      slices <- c(countedPassenger$firstClassFemalePassenger$survived, countedPassenger$firstClassFemalePassenger$dead)
    }
    # first class male
    if(choiceClass == "first" && choiceSex == "male"){
      slices <- c(countedPassenger$firstClassMalePassenger$survived, countedPassenger$firstClassMalePassenger$dead)
    }
    # secound class female
    if(choiceClass == "secound" && choiceSex == "female"){
      slices <- c(countedPassenger$secoundClassFemalePassenger$survived, countedPassenger$secoundClassFemalePassenger$dead)
    }
    # secound class male
    if(choiceClass == "secound" && choiceSex == "male"){
      slices <- c(countedPassenger$secoundClassMalePassenger$survived, countedPassenger$secoundClassMalePassenger$dead)
    }
    # third class female
    if(choiceClass == "third" && choiceSex == "female"){
      slices <- c(countedPassenger$thirdClassFemalePassenger$survived, countedPassenger$thirdClassFemalePassenger$dead)
    }
    # third class male
    if(choiceClass == "third" && choiceSex == "male"){
      slices <- c(countedPassenger$thirdClassMalePassenger$survived, countedPassenger$thirdClassMalePassenger$dead)
    }
  }
  
  # class age
  if(choiceClass != "all" && choiceSex == "all" && choiceAge != "all"){
    # first class children
    if(choiceClass == "first" && choiceAge == "children"){
      slices <- c(countedPassenger$firstClassChildPassenger$survived, countedPassenger$firstClassChildPassenger$dead)
    }
    # first class adults
    if(choiceClass == "first" && choiceAge == "adults"){
      slices <- c(countedPassenger$firstClassAdultPassenger$survived, countedPassenger$firstClassAdultPassenger$dead)
    }
    # secound class children
    if(choiceClass == "secound" && choiceAge == "children"){
      slices <- c(countedPassenger$secoundClassChildPassenger$survived, countedPassenger$secoundClassChildPassenger$dead)
    }
    # secound class adults
    if(choiceClass == "secound" && choiceAge == "adults"){
      slices <- c(countedPassenger$secoundClassAdultPassenger$survived, countedPassenger$secoundClassAdultPassenger$dead)
    }
    # third class children
    if(choiceClass == "third" && choiceAge == "children"){
      slices <- c(countedPassenger$thirdClassChildPassenger$survived, countedPassenger$thirdClassChildPassenger$dead)
    }
    # third class adults
    if(choiceClass == "third" && choiceAge == "adults"){
      slices <- c(countedPassenger$thirdClassAdultPassenger$survived, countedPassenger$thirdClassAdultPassenger$dead)
    }
  }
  
  # sex age
  if(choiceClass == "all" && choiceSex != "all" && choiceAge != "all"){
    # female children
    if(choiceSex == "female" && choiceAge == "children"){
      slices <- c(countedPassenger$femaleChildPassenger$survived, countedPassenger$femaleChildPassenger$dead)
    }
    # male children
    if(choiceSex == "male" && choiceAge == "children"){
      slices <- c(countedPassenger$maleChildPassenger$survived, countedPassenger$maleChildPassenger$dead)
    }
    # female adults
    if(choiceSex == "female" && choiceAge == "adults"){
      slices <- c(countedPassenger$femaleAdultPassenger$survived, countedPassenger$femaleAdultPassenger$dead)
    }
    # male adults
    if(choiceSex == "male" && choiceAge == "adults"){
      slices <- c(countedPassenger$maleAdultPassenger$survived, countedPassenger$maleAdultPassenger$dead)
    }
  }
  
  # class sex age
  if(choiceClass != "all" && choiceSex != "all" && choiceAge != "all"){
    # first class female children
    if(choiceClass == "first" && choiceSex == "female" && choiceAge == "children"){
      slices <- c(countedPassenger$firstClassFemaleChildPassenger$survived, countedPassenger$firstClassFemaleChildPassenger$dead)
    }
    # first class male children
    if(choiceClass == "first" && choiceSex == "male" && choiceAge == "children"){
      slices <- c(countedPassenger$firstClassMaleChildPassenger$survived, countedPassenger$firstClassMaleChildPassenger$dead)
    }
    # first class female adult
    if(choiceClass == "first" && choiceSex == "female" && choiceAge == "adults"){
      slices <- c(countedPassenger$firstClassFemaleAdultPassenger$survived, countedPassenger$firstClassFemaleAdultPassenger$dead)
    }
    # first class adult
    if(choiceClass == "first" && choiceSex == "male" && choiceAge == "adults"){
      slices <- c(countedPassenger$firstClassMaleAdultPassenger$survived, countedPassenger$firstClassMaleAdultPassenger$dead)
    }
    
    # secound class female children
    if(choiceClass == "secound" && choiceSex == "female" && choiceAge == "children"){
      slices <- c(countedPassenger$secoundClassFemaleChildPassenger$survived, countedPassenger$secoundClassFemaleChildPassenger$dead)
    }
    # secound class male children
    if(choiceClass == "secound" && choiceSex == "male" && choiceAge == "children"){
      slices <- c(countedPassenger$secoundClassMaleChildPassenger$survived, countedPassenger$secoundClassMaleChildPassenger$dead)
    }
    # secound class female adult
    if(choiceClass == "secound" && choiceSex == "female" && choiceAge == "adults"){
      slices <- c(countedPassenger$secoundClassFemaleAdultPassenger$survived, countedPassenger$secoundClassFemaleAdultPassenger$dead)
    }
    # secound class adult
    if(choiceClass == "secound" && choiceSex == "male" && choiceAge == "adults"){
      slices <- c(countedPassenger$secoundClassMaleAdultPassenger$survived, countedPassenger$secoundClassMaleAdultPassenger$dead)
    }
    
    # third class female children
    if(choiceClass == "third" && choiceSex == "female" && choiceAge == "children"){
      slices <- c(countedPassenger$thirdClassFemaleChildPassenger$survived, countedPassenger$thirdClassFemaleChildPassenger$dead)
    }
    # third class male children
    if(choiceClass == "third" && choiceSex == "male" && choiceAge == "children"){
      slices <- c(countedPassenger$thirdClassMaleChildPassenger$survived, countedPassenger$thirdClassMaleChildPassenger$dead)
    }
    # third class female adult
    if(choiceClass == "third" && choiceSex == "female" && choiceAge == "adults"){
      slices <- c(countedPassenger$thirdClassFemaleAdultPassenger$survived, countedPassenger$thirdClassFemaleAdultPassenger$dead)
    }
    # third class adult
    if(choiceClass == "third" && choiceSex == "male" && choiceAge == "adults"){
      slices <- c(countedPassenger$thirdClassMaleAdultPassenger$survived, countedPassenger$thirdClassMaleAdultPassenger$dead)
    }
  }
  
  #print(slices)
  return(slices)
}
# filterPassenger.R
filterPassenger <- function(titanicData){
  allPassenger <-list("survived" = 0, "dead" = 0);
  femalePassenger <-list("survived" = 0, "dead" = 0);
  malePassenger <-list("survived" = 0, "dead" = 0);
  childPassenger <-list("survived" = 0, "dead" = 0);
  adultPassenger <-list("survived" = 0, "dead" = 0);
  femaleChildPassenger <-list("survived" = 0, "dead" = 0);
  maleChildPassenger <-list("survived" = 0, "dead" = 0);
  femaleAdultPassenger <-list("survived" = 0, "dead" = 0);
  maleAdultPassenger <-list("survived" = 0, "dead" = 0);
  firstClassPassenger <-list("survived" = 0, "dead" = 0);
  secoundClassPassenger <-list("survived" = 0, "dead" = 0);
  thirdClassPassenger <-list("survived" = 0, "dead" = 0);
  firstClassFemalePassenger <-list("survived" = 0, "dead" = 0);
  secoundClassFemalePassenger <-list("survived" = 0, "dead" = 0);
  thirdClassFemalePassenger <-list("survived" = 0, "dead" = 0);
  firstClassMalePassenger <-list("survived" = 0, "dead" = 0);
  secoundClassMalePassenger <-list("survived" = 0, "dead" = 0);
  thirdClassMalePassenger <-list("survived" = 0, "dead" = 0);
  firstClassChildPassenger  <-list("survived" = 0, "dead" = 0);
  secoundClassChildPassenger  <-list("survived" = 0, "dead" = 0);
  thirdClassChildPassenger  <-list("survived" = 0, "dead" = 0);
  firstClassAdultPassenger  <-list("survived" = 0, "dead" = 0);
  secoundClassAdultPassenger  <-list("survived" = 0, "dead" = 0);
  thirdClassAdultPassenger  <-list("survived" = 0, "dead" = 0);
  firstClassFemaleChildPassenger  <-list("survived" = 0, "dead" = 0);
  secoundClassFemaleChildPassenger  <-list("survived" = 0, "dead" = 0);
  thirdClassFemaleChildPassenger  <-list("survived" = 0, "dead" = 0);
  firstClassFemaleAdultPassenger  <-list("survived" = 0, "dead" = 0);
  secoundClassFemaleAdultPassenger  <-list("survived" = 0, "dead" = 0);
  thirdClassFemaleAdultPassenger  <-list("survived" = 0, "dead" = 0);
  firstClassMaleChildPassenger  <-list("survived" = 0, "dead" = 0);
  secoundClassMaleChildPassenger  <-list("survived" = 0, "dead" = 0);
  thirdClassMaleChildPassenger  <-list("survived" = 0, "dead" = 0);
  firstClassMaleAdultPassenger  <-list("survived" = 0, "dead" = 0);
  secoundClassMaleAdultPassenger  <-list("survived" = 0, "dead" = 0);
  thirdClassMaleAdultPassenger  <-list("survived" = 0, "dead" = 0);
  
  for (myRow in 1:1309){
    actuellPassenger <- passenger(titanicData, myRow)
    #print(paste0("class: ", actuellPassenger$pclass))
    
    allPassenger <- allPass(actuellPassenger,allPassenger$survived, allPassenger$dead)
    #print(paste0("survived: ", allPassenger$survived))
    #print(paste0("dead: ", allPassenger$dead))
    
    # Survived or dead first class
    if(actuellPassenger$pclass == 1){
      firstClassPassenger <- allPass(actuellPassenger, firstClassPassenger$survived, firstClassPassenger$dead)
    }
    
    # Survived or dead secound class
    if(actuellPassenger$pclass == 2){
      secoundClassPassenger <- allPass(actuellPassenger, secoundClassPassenger$survived, secoundClassPassenger$dead)
    }
    
    # Survived or dead third class
    if(actuellPassenger$pclass == 3){
      thirdClassPassenger <- allPass(actuellPassenger, thirdClassPassenger$survived, thirdClassPassenger$dead)
    }
    
    if(!is.na(actuellPassenger$sex)){
      # Survived or dead female
      if(actuellPassenger$sex == "female"){
        femalePassenger <- allPass(actuellPassenger, femalePassenger$survived, femalePassenger$dead)
      }
      
      # Survived or dead male
      if(actuellPassenger$sex == "male"){
        malePassenger <- allPass(actuellPassenger, malePassenger$survived, malePassenger$dead)
      }
      
      # Survived or dead first class female
      if(actuellPassenger$pclass == 1 && actuellPassenger$sex == "female"){
        firstClassFemalePassenger <- allPass(actuellPassenger, firstClassFemalePassenger$survived, firstClassFemalePassenger$dead)
      }
      
      # Survived or dead secound class female
      if(actuellPassenger$pclass == 2 && actuellPassenger$sex == "female"){
        secoundClassFemalePassenger <- allPass(actuellPassenger, secoundClassFemalePassenger$survived, secoundClassFemalePassenger$dead)
      }
      
      # Survived or dead third class female
      if(actuellPassenger$pclass == 3 && actuellPassenger$sex == "female"){
        thirdClassFemalePassenger <- allPass(actuellPassenger, thirdClassFemalePassenger$survived, thirdClassFemalePassenger$dead)
      }
      
      # Survived or dead first class male
      if(actuellPassenger$pclass == 1 && actuellPassenger$sex == "male"){
        firstClassMalePassenger <- allPass(actuellPassenger, firstClassMalePassenger$survived, firstClassMalePassenger$dead)
      }
      
      # Survived or dead secound class male
      if(actuellPassenger$pclass == 2 && actuellPassenger$sex == "male"){
        secoundClassMalePassenger <- allPass(actuellPassenger, secoundClassMalePassenger$survived, secoundClassMalePassenger$dead)
      }
      
      # Survived or dead third class male
      if(actuellPassenger$pclass == 3 && actuellPassenger$sex == "male"){
        thirdClassMalePassenger <- allPass(actuellPassenger, thirdClassMalePassenger$survived, thirdClassMalePassenger$dead)
      }
    }
    
    if(!is.na(actuellPassenger$age)){
      #print(actuellPassenger$age)
      # Survived or dead child
      if(actuellPassenger$age <= 18){
        childPassenger <- allPass(actuellPassenger, childPassenger$survived, childPassenger$dead)
      }
      
      # Survived or dead adult
      if(actuellPassenger$age >= 18){
        adultPassenger <- allPass(actuellPassenger, adultPassenger$survived, adultPassenger$dead)
      }
      
      # Survived or dead first class child
      if(actuellPassenger$pclass == 1 && actuellPassenger$age <= 18){
        firstClassChildPassenger <- allPass(actuellPassenger, firstClassChildPassenger$survived, firstClassChildPassenger$dead)
      }
      
      # Survived or dead secound class child
      if(actuellPassenger$pclass == 2 && actuellPassenger$age <= 18){
        secoundClassChildPassenger <- allPass(actuellPassenger, secoundClassChildPassenger$survived, secoundClassChildPassenger$dead)
      }
      
      # Survived or dead third class child
      if(actuellPassenger$pclass == 3 && actuellPassenger$age <= 18){
        thirdClassChildPassenger <- allPass(actuellPassenger, thirdClassChildPassenger$survived, thirdClassChildPassenger$dead)
      }
      
      # Survived or dead first class adult
      if(actuellPassenger$pclass == 1 && actuellPassenger$age >= 18){
        firstClassAdultPassenger <- allPass(actuellPassenger, firstClassAdultPassenger$survived, firstClassAdultPassenger$dead)
      }
      
      # Survived or dead secound class adult
      if(actuellPassenger$pclass == 2 && actuellPassenger$age >= 18){
        secoundClassAdultPassenger <- allPass(actuellPassenger, secoundClassAdultPassenger$survived, secoundClassAdultPassenger$dead)
      }
      
      # Survived or dead third class adult
      if(actuellPassenger$pclass == 3 && actuellPassenger$age >= 18){
        thirdClassAdultPassenger <- allPass(actuellPassenger, thirdClassAdultPassenger$survived, thirdClassAdultPassenger$dead)
      }
    }
    
    if(!is.na(actuellPassenger$age) && !is.na(actuellPassenger$sex)){
      # Survived or dead female child
      if(actuellPassenger$age <= 18 && actuellPassenger$sex == "female"){
        femaleChildPassenger <- allPass(actuellPassenger, femaleChildPassenger$survived, femaleChildPassenger$dead)
      }
      
      # Survived or dead female adult
      if(actuellPassenger$age >= 18 && actuellPassenger$sex == "female"){
        femaleAdultPassenger <- allPass(actuellPassenger, femaleAdultPassenger$survived, femaleAdultPassenger$dead)
      }
      
      # Survived or dead male child
      if(actuellPassenger$age <= 18 && actuellPassenger$sex == "male"){
        maleChildPassenger <- allPass(actuellPassenger, maleChildPassenger$survived, maleChildPassenger$dead)
      }
      
      # Survived or dead male adult
      if(actuellPassenger$age >= 18 && actuellPassenger$sex == "male"){
        maleAdultPassenger <- allPass(actuellPassenger, maleAdultPassenger$survived, maleAdultPassenger$dead)
      }
      
      # Survived or dead first class female child
      if(actuellPassenger$pclass == 1 && actuellPassenger$sex == "female" && actuellPassenger$age <= 18){
        firstClassFemaleChildPassenger <- allPass(actuellPassenger, firstClassFemaleChildPassenger$survived, firstClassFemaleChildPassenger$dead)
      }
      
      # Survived or dead secound class female child
      if(actuellPassenger$pclass == 2 && actuellPassenger$sex == "female" && actuellPassenger$age <= 18){
        secoundClassFemaleChildPassenger <- allPass(actuellPassenger, secoundClassFemaleChildPassenger$survived, secoundClassFemaleChildPassenger$dead)
      }
      
      # Survived or dead third class female child
      if(actuellPassenger$pclass == 3 && actuellPassenger$sex == "female" && actuellPassenger$age <= 18){
        thirdClassFemaleChildPassenger <- allPass(actuellPassenger, thirdClassFemaleChildPassenger$survived, thirdClassFemaleChildPassenger$dead)
      }
      
      # Survived or dead first class female adult
      if(actuellPassenger$pclass == 1 && actuellPassenger$sex == "female" && actuellPassenger$age >= 18){
        firstClassFemaleAdultPassenger <- allPass(actuellPassenger, firstClassFemaleAdultPassenger$survived, firstClassFemaleAdultPassenger$dead)
      }
      
      # Survived or dead secound class female adult
      if(actuellPassenger$pclass == 2 && actuellPassenger$sex == "female" && actuellPassenger$age >= 18){
        secoundClassFemaleAdultPassenger <- allPass(actuellPassenger, secoundClassFemaleAdultPassenger$survived, secoundClassFemaleAdultPassenger$dead)
      }
      
      # Survived or dead third class female adult
      if(actuellPassenger$pclass == 3 && actuellPassenger$sex == "female" && actuellPassenger$age >= 18){
        thirdClassFemaleAdultPassenger <- allPass(actuellPassenger, thirdClassFemaleAdultPassenger$survived, thirdClassFemaleAdultPassenger$dead)
      }
      # Survived or dead first class male child
      if(actuellPassenger$pclass == 1 && actuellPassenger$sex == "male" && actuellPassenger$age <= 18){
        firstClassMaleChildPassenger <- allPass(actuellPassenger, firstClassMaleChildPassenger$survived, firstClassMaleChildPassenger$dead)
      }
      
      # Survived or dead secound class male child
      if(actuellPassenger$pclass == 2 && actuellPassenger$sex == "male" && actuellPassenger$age <= 18){
        secoundClassMaleChildPassenger <- allPass(actuellPassenger, secoundClassMaleChildPassenger$survived, secoundClassMaleChildPassenger$dead)
      }
      
      # Survived or dead third class male child
      if(actuellPassenger$pclass == 3 && actuellPassenger$sex == "male" && actuellPassenger$age <= 18){
        thirdClassMaleChildPassenger <- allPass(actuellPassenger, thirdClassMaleChildPassenger$survived, thirdClassMaleChildPassenger$dead)
      }
      
      # Survived or dead first class male adult
      if(actuellPassenger$pclass == 1 && actuellPassenger$sex == "male" && actuellPassenger$age >= 18){
        firstClassMaleAdultPassenger <- allPass(actuellPassenger, firstClassMaleAdultPassenger$survived, firstClassMaleAdultPassenger$dead)
      }
      
      # Survived or dead secound class female adult
      if(actuellPassenger$pclass == 2 && actuellPassenger$sex == "female" && actuellPassenger$age >= 18){
        secoundClassMaleAdultPassenger <- allPass(actuellPassenger, secoundClassMaleAdultPassenger$survived, secoundClassMaleAdultPassenger$dead)
      }
      
      # Survived or dead third class female adult
      if(actuellPassenger$pclass == 3 && actuellPassenger$sex == "female" && actuellPassenger$age >= 18){
        thirdClassMaleAdultPassenger <- allPass(actuellPassenger, thirdClassMaleAdultPassenger$survived, thirdClassMaleAdultPassenger$dead)
      }
    }
    
  }
  return(list("allPassenger" = allPassenger,
              "femalePassenger" =  femalePassenger,
              "malePassenger" = malePassenger,
              "childPassenger" = childPassenger,
              "adultPassenger" = adultPassenger,
              "femaleChildPassenger" = femaleChildPassenger,
              "maleChildPassenger" = maleChildPassenger,
              "femaleAdultPassenger" = femaleAdultPassenger,
              "maleAdultPassenger" = maleAdultPassenger,
              "firstClassPassenger" = firstClassPassenger,
              "secoundClassPassenger" = secoundClassPassenger,
              "thirdClassPassenger" = thirdClassPassenger,
              "firstClassFemalePassenger" = firstClassFemalePassenger,
              "secoundClassFemalePassenger" = secoundClassFemalePassenger,
              "thirdClassFemalePassenger" = thirdClassFemalePassenger,
              "firstClassMalePassenger" = firstClassMalePassenger,
              "secoundClassMalePassenger" = secoundClassMalePassenger,
              "thirdClassMalePassenger" = thirdClassMalePassenger,
              "firstClassChildPassenger" = firstClassChildPassenger,
              "secoundClassChildPassenger" = secoundClassChildPassenger,
              "thirdClassChildPassenger" = thirdClassChildPassenger,
              "firstClassAdultPassenger" = firstClassAdultPassenger,
              "secoundClassAdultPassenger" = secoundClassAdultPassenger,
              "thirdClassAdultPassenger" = thirdClassAdultPassenger,
              "firstClassFemaleChildPassenger" = firstClassFemaleChildPassenger,
              "secoundClassFemaleChildPassenger" = secoundClassFemaleChildPassenger,
              "thirdClassFemaleChildPassenger" = thirdClassFemaleChildPassenger,
              "firstClassFemaleAdultPassenger" = firstClassFemaleAdultPassenger,
              "secoundClassFemaleAdultPassenger" = secoundClassFemaleAdultPassenger,
              "thirdClassFemaleAdultPassenger" = thirdClassFemaleAdultPassenger,
              "firstClassMaleChildPassenger" = firstClassMaleChildPassenger,
              "secoundClassMaleChildPassenger" = secoundClassMaleChildPassenger,
              "thirdClassMaleChildPassenger" = thirdClassMaleChildPassenger,
              "firstClassMaleAdultPassenger" = firstClassMaleAdultPassenger,
              "secoundClassMaleAdultPassenger" = secoundClassMaleAdultPassenger,
              "thirdClassMaleAdultPassenger" = thirdClassMaleAdultPassenger))
  
}

Here you can download a ZIP-Folder with the complete program:

Titanic2 – R-Program

Processing: Titanic

  • Processing: Titanic - If you start the programm you will see these pie charts
    Processing: Titanic - If you start the programm you will see these pie charts

Processing: Titanic

Task:

Show the data about how many people survived and how many people died at the Titanic. Use the data from a given file and implement it using Processing.

Description of the solution:

This program focus on the interaction with the user to visualize the data of the Titanic.

I used pie charts to show the percentage of how many people survived and how many died. Therefore, there are four pie charts. The first one shows the percentages for all passengers. In the second to fourth one you can choose by clicking on the checkboxes from which sex (second pie chart), passenger class (third pie chart) or age group (fourth pie chart) you like to see the percentages in the pie chart.

Processing-Code: Titanic
//A class for Passengers to collect the data in one object
class Passenger {
  int pclass; 
  int survived; 
  String sex; 
  float age;
  // Get dat
  Passenger(XML[ ]titanicData, int row) {
    XML pass = titanicData[row];
    this.pclass = pass.getChildren("Cell")[0].getIntContent();
    this.survived = pass.getChildren("Cell")[1].getIntContent();
    this.sex = pass.getChildren("Cell")[3].getContent();
    this.age = pass.getChildren("Cell")[4].getIntContent();
  }
}

// Declare some variables
public Passenger[] passengerList;
public int selectedClass = 1;
public String selectedSex = "male";
public int selectedMinAge = 0;
public int selectedMaxAge = 18;
public String selectedAge = "children";
public float[] allAngles;
public float[] pclassAngles;
public float[] sexAngles;
public float[] ageAngles;
public String allHead = "All passengers";
public String pclassHead;
public String sexHead;
public String ageHead;
public PFont b;
public PFont n;
public float red = 255;
public float green = 0;

void setup () {
  //Set the size and background of the programm
  size(1200, 900);
  background(255); //white

  //Load the File with all the data
  XML worksheet = loadXML("titanic passenger list.xml");
  XML[] rows = worksheet.getChildren("Worksheet")[0].getChildren("Table")[0].getChildren("Row");
  
  //Set the fonts
  b = createFont("Arial Black", 24, true);
  n = createFont("Arial", 24, true);
  
  //Implement a list for all passenger
  passengerList = new Passenger[1309];
  
  //Load the data from each passenger into a list of the object passenger
  for (int count = 0; count < 1309; count++) {
    passengerList[count] = new Passenger(rows, count);
  }
}

void draw () {
  //Count which survived and not survived 
  float[] allStatus = countAll(passengerList);
  allAngles = getAngels(allStatus);

  float[] pclassStatus = countPclass(passengerList, selectedClass);
  pclassAngles = getAngels(pclassStatus);

  float[] sexStatus = countSex(passengerList, selectedSex);
  sexAngles = getAngels(sexStatus);

  float[] ageStatus = countAge(passengerList, selectedMinAge, selectedMaxAge);
  ageAngles = getAngels(ageStatus);
  
  //Draw the boarders around the pie charts and it's descriptions/choices
  fill(255);
  rect(20, 20, 360, 400);
  rect(20, 470, 360, 400);
  rect(420, 20, 360, 400);
  rect(420, 470, 360, 400);

  //Draw pie chart and text for all passenger
  fill(0); 
  textFont(b, 16);
  text(allHead, 50, 50);
  pieChart(200, 250, 300, allAngles);
  
  //Draw pie chart and text for all passenger from selected class
  fill(0); 
  pclassHead = "Passenger from class " + selectedClass;
  textFont(b, 16);
  text(pclassHead, 50, 500);
  textFont(n, 16);
  fill(255);
  if (selectedClass == 1) {
    fill(255);
    rect(50, 515, 10, 10);
    rect(150, 515, 10, 10);
    rect(250, 515, 10, 10);
    fill(0);
    text("X", 50, 525);
  } else if (selectedClass == 2) {
    fill(255);
    rect(50, 515, 10, 10);
    rect(150, 515, 10, 10);
    rect(250, 515, 10, 10);
    fill(0);
    text("X", 150, 525);
  } else if (selectedClass == 3) {
    fill(255);
    rect(50, 515, 10, 10);
    rect(150, 515, 10, 10);
    rect(250, 515, 10, 10);
    fill(0);
    text("X", 250, 525);
  }
  fill(0);
  text("Class 1", 65, 525);
  text("Class 2", 165, 525);
  text("Class 3", 265, 525);
  pieChart(200, 700, 300, pclassAngles);
  //Change selection of class by clicking on the check boxes
  if (mouseX > 50 && mouseX < 60 && mouseY > 515 && mouseY < 525 && mousePressed == true) {
    selectedClass = 1;
  } else if (mouseX > 150 && mouseX < 160 && mouseY > 515 && mouseY < 525 && mousePressed == true) {
    selectedClass = 2;
  } else if (mouseX > 250 && mouseX < 260 && mouseY > 515 && mouseY < 525 && mousePressed == true) {
    println("in");
    selectedClass = 3;
  }
  
  //Draw pie chart and text for all passenger from selected sex
  fill(0);
  sexHead = "Passenger with sex " + selectedSex;
  textFont(b, 16);
  text(sexHead, 450, 50);
  textFont(n, 16);
  if (selectedSex == "male") {
    fill(255);
    rect(450, 65, 10, 10);
    rect(550, 65, 10, 10);
    fill(0);
    text("X", 450, 75);
  } else if (selectedSex == "female") {
    fill(255);
    rect(450, 65, 10, 10);
    rect(550, 65, 10, 10);
    fill(0);
    text("X", 550, 75);
  }
  fill(0);
  text("male", 465, 75);
  text("female", 565, 75);
  pieChart(600, 250, 300, sexAngles);
  
  //Change selection of sex by clicking on the check boxes
  if (mouseX > 450 && mouseX < 460 && mouseY > 65 && mouseY < 75 && mousePressed == true) {
    selectedSex = "male";
  } else if (mouseX > 550 && mouseX < 560 && mouseY > 65 && mouseY < 75 && mousePressed == true) {
    selectedSex = "female";
  }
  
  //Draw pie chart and text for all passenger from selected age group
  fill(0);
  ageHead = "Passenger from age group " + selectedAge;
  textFont(b, 16);
  text(ageHead, 450, 500);
  textFont(n, 16);

  if (selectedAge == "children") {
    selectedMinAge = 0;
    selectedMaxAge = 18;
    fill(255);
    rect(450, 515, 10, 10);
    rect(550, 515, 10, 10);
    fill(0);
    text("X", 450, 525);
  } else if (selectedAge == "adults") {
    selectedMinAge = 18;
    selectedMaxAge = 90;
    fill(255);
    rect(450, 515, 10, 10);
    rect(550, 515, 10, 10);
    fill(0);
    text("X", 550, 525);
  }
  fill(0);
  text("children", 465, 525);
  text("adults", 565, 525);
  pieChart(600, 700, 300, ageAngles);  
  
  //Change selection of age group by clicking on the check boxes
  if (mouseX > 450 && mouseX < 460 && mouseY > 515 && mouseY < 525 && mousePressed == true) {
    selectedAge = "children";
  } else if (mouseX > 550 && mouseX < 560 && mouseY > 515 && mouseY < 525 && mousePressed == true) {
    selectedAge = "adults";
  }

  //Draw the ledgend
  fill(200);
  rect(900, 20, 150, 120);
  fill(0);
  textFont(b, 16);
  text("Ledgend:", 910, 50);

  textFont(n, 16);

  fill(255, 0, 0);
  rect(910, 80, 10, 10);
  fill(0);
  text("dead", 925, 90);

  fill(0, 255, 0);
  rect(910, 110, 10, 10);
  fill(0);
  text("survived", 925, 120);
}


// Returns the values for angels for a pie chart from given valus
public float[] getAngels(float[] status) {
  float total = status[0];
  float alive = status[1];
  float dead = status[2];

  float degreeAlive = (alive / total) * 360;
  float degreeDead = (dead / total) * 360;
  
  float percentAlive = (alive / total) * 100;
  float percentDead = (dead / total) * 100;
  
  float[] angeles = {degreeAlive, degreeDead, percentAlive, percentDead};
  return angeles;
}

//Returns the amount of survived and not survived passengers in a given class
public float[] countPclass(Passenger[] passengerList, int choiceClass) {
  float live = 0;
  float dead = 0;
  float total = 0;
  for (int i = 1; i < passengerList.length; i++) {
    if (passengerList[i].pclass == choiceClass) {
      total++;
      if (passengerList[i].survived == 1) {
        live++;
      } else {
        dead++;
      }
    }
  }
  float[] status = {total, live, dead};
  return status;
}

//Returns the amount of survived and not survived passengers within a given age
public float[] countAge(Passenger[] passengerList, int choiceMinAge, int choiceMaxAge) {
  float live = 0;
  float dead = 0;
  float total = 0;
  for (int i = 1; i < passengerList.length; i++) {
    if (passengerList[i].age >= choiceMinAge && passengerList[i].age <= choiceMaxAge) {
      total++;
      if (passengerList[i].survived == 1) {
        live++;
      } else {
        dead++;
      }
    }
  }
  float[] status = {total, live, dead};
  return status;
}

//Returns the amount of survived and not survived passengers with a given sex
public float[] countSex(Passenger[] passengerList, String choiceSex) {
  float live = 0;
  float dead = 0;
  float total = 0;
  for (int i = 1; i < passengerList.length; i++) {
    if (passengerList[i].sex.equals(choiceSex)) {
      total++;
      if (passengerList[i].survived == 1) {
        live++;
      } else {
        dead++;
      }
    }
  }
  float[] status = {total, live, dead};
  return status;
}


//Returns the amount of survived and not survived passengers at all
public float[] countAll(Passenger[] passengerList) {
  float live = 0;
  float dead = 0;
  float total = 0;
  for (int i = 1; i < passengerList.length; i++) {
    total++;
    if (passengerList[i].survived == 1) {
      live++;
    } else {
      dead++;
    }
  }
  float[] status = {total, live, dead};
  return status;
}

//Create the pie chart --> The example at https://www.processing.org/examples/piechart.html
void pieChart(float x, float y, float diameter, float[] angels) {
  /* Source: https://processing.org/examples/piechart.html*/
  float lastAngle = 0;
  for (int i = 0; i < 2; i++) {
    if (red == 255) {
      red = 0;
    } else {
      red = 255;
    }
    if (green == 255) {
      green = 0;
    } else {
      green = 255;
    }
    fill(red, green, 0);
    arc(x, y, diameter, diameter, lastAngle, lastAngle+radians(angels[i]));
    lastAngle += radians(angels[i]);
  }
  textFont(b, 16);
  fill(0);
  text("survived:" + "\n" + (float)(((int)(angels[2]*100))/100.0) + "%", x+30, y+30);
  fill(255);
  text("dead: " + "\n" + (float)(((int)(angels[3]*100))/100.0) + "%", x+30, y-55);
}

Here you can download a ZIP-Folder with the complete program:

Titanic – Processing-Programm