​

function setup() {

  createCanvas(1300, 1500);

  background(200);

  loadJSON('https://data.cdc.gov/resource/pj7m-y5uh.json', gotData);

}

​

function gotData(data) {

  deaths = data;

  //print(deaths);

  print(deaths[4].non_hispanic_white);

}

​

function mousePressed() {

  save('myCanvas.jpg');

}

​

function draw() {

fill(73,56,49);

  noStroke();

text('Covid deaths by state: February 1, 2020 to November 1, 2020', 600, 75);

text('*One or more data cells have been suppressed as per Federal Goverment', 600, 95);

  x = 0;

  y = 0;

​

  if (deaths) {

    for (i = 4; i < deaths.length; i++) {

      fill(210, 72, 88, 40);

      stroke(210, 72, 88);

      ellipse(x + 210, y + 240, deaths[i].non_hispanic_white / 20, );

      fill(255);

      noStroke();

      text('white', x + 210, y + 240);

      //////////////////

​

      fill(234, 134, 118, 50);

      stroke(234, 134, 118);

      ellipse(x + 700, y + 300, deaths[i].non_hispanic_black_african_american / 20);

      fill(255);

     // noStroke();

      text('black', x + 700, y + 300);

        //////////////////

​

      fill(234, 176, 94, 50);

      stroke(234, 176, 94);

      ellipse(x + 400, y + 100, deaths[i].non_hispanic_american_indian_alaska_native / 20);

      fill(255);

      text('american indian alaska native', x + 400, y + 100);

​

        //////////////////

​

​

      fill(73,56,49, 50);

      stroke(73,56,49);

      ellipse(x + 400, y + 400, deaths[i].non_hispanic_asian_pacific_islander / 20);

       fill(255);

      //noStroke();

      text('pacific islander', x + 400, y + 400);

​

        //////////////////

​

      fill(253, 238, 205, 50);

      stroke(253, 238, 205);

      ellipse(x + 550, y + 550, deaths[i].hispanic_latino_total / 20);

      fill(255);

      noStroke();

      text('latinx', x + 550, y + 500);

​

      noLoop();

      //print(deaths[i].non_hispanic_black_african_american + "<br >");

    }

​

    //ellipse(100, 100,

    // deaths[35].non_hispanic_black_african_american, 

    //deaths[35].non_hispanic_black_african_american);

​

    //ellipse(200, 200,

    // deaths[37].non_hispanic_black_african_american, 

    // deaths[37].non_hispanic_black_african_american);

​

  }

}