Darya_Mahcup-MCD

let characters;

​

function preload() {

  characters = loadTable(

    "mcd.csv",

    'csv',

    'header');

}

​

function setup() {

  createCanvas(innerWidth, innerHeight);

  noLoop();

  // number of columns - determines the number of properties (Keys)

  print(characters.getColumnCount());

  // number of rows - determines the number of characters

  print(characters.getRowCount());

  // list the table as objects

  print(characters.getObject());

  print(characters.getObject());

}

​

function draw() {

  background(50);

  noStroke(); // disable stroke

  textAlign(LEFT,TOP); // set text alignment

  textSize(40);

  fill(43,192,154);

  text("McDonald's Dataset", 10,30);

  for (let i = 0; i < characters.getRowCount(); i++) {

    fill(255);

    // display name

    var names = characters.get(i, "name");

    var nx = 50;

    var ny = 100 +(i * 15);

    textSize(10);

    text(names, nx, ny);

    //datas

    var ec = characters.get(i, "energy");

    var pc = characters.get(i, "protein");

    var tc = characters.get(i, "total_fat");

    var sc = characters.get(i, "sat_fat");

    var trc = characters.get(i, "trans_fat");

    var cc = characters.get(i, "chol");

    var cac = characters.get(i, "carbs");

    var tsc = characters.get(i, "total_sugar");

    var ac = characters.get(i, "added_sugar");

    var soc = characters.get(i, "sodium");

    if( ec > 500) {

      fill(255,0,0,126);

    }else{

      fill(255,0,0);

    }

    var ex = 400;

    var ey = ny;

    var w = ec/16;

    var h = ec/16;

    ellipseMode(CENTER);

    ellipse(ex, ey, w, h);

    if( pc > 10) {

      fill(255,255,0,126);

    }else{

      fill(255,255,0);

    }

    var px = 500;

    var py = ny;

    var pw = pc;

    var ph = pc;

    ellipseMode(CENTER);

    ellipse(px, py, pw, ph);

    if( tc > 10) {

      fill(0,128,0,126);

    }else{

      fill(0,128,0);

    }

    var tx = 600;

    var ty = ny;

    var tw = tc;

    var th = tc;

    ellipseMode(CENTER);

    ellipse(tx, ty, tw, th);

    if( sc > 10) {

      fill(0,0,255,126);

    }else{

      fill(0,0,255);

    }

    var sx = 700;

    var sy = ny;

    var sw = sc;

    var sh = sc;

    ellipseMode(CENTER);

    ellipse(sx, sy, sw, sh);

    var trx = 800;

    var tray = ny;

    var trw = trc;

    var trh = trc;

    ellipseMode(CENTER);

    fill(255,20,147);

    ellipse(trx, tray, trw, trh);

    if( cc > 50) {

      fill(255,222,173,126);

    }else{

      fill(255,222,173);

    }

    var cx = 900;

    var cy = ny;

    var cw = cc;

    var ch = cc;

    ellipseMode(CENTER);

    ellipse(cx, cy, cw, ch);

    if( cac > 25) {

      fill(128,0,128,126);

    }else{

      fill(128,0,128);

    }

    var cax = 1000;

    var cay = ny;

    var caw = cac;

    var cah = cac;

    ellipseMode(CENTER);

    ellipse(cax, cay, caw, cah);

    if( tsc > 10) {

      fill(165,42,42,126);

    }else{

      fill(165,42,42);

    }

    var tsx = 1100;

    var tsy = ny;

    var tsw = tsc;

    var tsh = tsc;

    ellipseMode(CENTER);

    ellipse(tsx, tsy, tsw, tsh);

    if( ac > 15) {

      fill(255,255,255,126);

    }else{

      fill(255,255,255);

    }

    var ax = 1200;

    var ay = ny;

    var aw = ac;

    var ah = ac;

    ellipseMode(CENTER);

    ellipse(ax, ay, aw, ah);

    if( soc > 500) {

      fill(135,206,250,126);

    }else{

      fill(135,206,250);

    }

    var sox = 1300;

    var soy = ny;

    var sow = soc/16;

    var soh = soc/16;

    ellipseMode(CENTER);

    ellipse(sox, soy, sow, soh);

  }

  textAlign(CENTER,CENTER);

  fill(255);

  translate(400,50);

  rotate(3*PI/2);

    textSize(13);

    text('Serving Size', 0, 0);

  textAlign(CENTER,CENTER);

  fill(255);

  rotate(4*(PI/2));

    textSize(13);

  translate(-15,100);

  text('Energy', 0, 0);

    textAlign(CENTER,CENTER);

  fill(255);

  rotate(4*(PI/2));

    textSize(13);

  translate(0,100);

  text('Protein', 0, 0);

      textAlign(CENTER,CENTER);

  fill(255);

  rotate(4*(PI/2));

    textSize(13);

  translate(3,100);

  text('Total-fat', 0, 0);

​

​

    textAlign(CENTER,CENTER);

  fill(255);

  rotate(4*(PI/2));

    textSize(13);

  translate(3,100);

  text('Trans-fat', 0, 0);

      textAlign(CENTER,CENTER);

  fill(255);

  rotate(4*(PI/2));

    textSize(13);

  translate(3,100);

  text('Chol', 0, 0);

      textAlign(CENTER,CENTER);

  fill(255);

  rotate(4*(PI/2));

    textSize(13);

  translate(3,100);

  text('Carbs', 0, 0);

      textAlign(CENTER,CENTER);

  fill(255);

  rotate(4*(PI/2));

    textSize(13);

  translate(3,100);

  text('Total Sugar', 0, 0);

      textAlign(CENTER,CENTER);

  fill(255);

  rotate(4*(PI/2));

    textSize(13);

  translate(3,100);

  text('Added Sugar', 0, 0);

      textAlign(CENTER,CENTER);

  fill(255);

  rotate(4*(PI/2));

    textSize(13);

  translate(3,100);

  text('Sodium', 0, 0);

}