//let APIkey = "access_key=9b0c1d570c14ad878816c4e00f6fcc74";

let endpoint = "/2020-02-15..?";

let parameters = "amount=1&from=USD&to=CNY";

let covid = "https://pomber.github.io/covid19/timeseries.json";

let rates;

let x;

let b=500;

let CNY=[];

let dates=[];

let num=[];

let retrieveCode=[26,68,113,155,197,239,281,323];

let textLocation=[50, 122, 194, 266, 338, 410, 482, 554];

​

​

​

function setup() {

  createCanvas(600, 600);

  background(0);

  let url = host+endpoint+parameters;

  loadJSON(url,getData);

  loadJSON(covid,getCovidData);

​

​

​

​

}

​

function draw() {

  //console.log(mouseX, mouseY);

}

​

function getData(data){

  rates=data.rates;

  for(date in rates){

    CNYrate = rates[date].CNY

    CNY.push(CNYrate);

    dates.push(date);

  }

   for(d in dates){

     num.push(d);

   }

  //print(num.length);

  for (let n=0; n<num.length;n+=30){

    fill(255);

    textSize(12);

    textAlign(CENTER);

    text(dates[num[n]],n*2.4+50,b);

    fill(255,153,194);

    text(CNY[num[n]],n*2.4+50,480);

    fill(255,0,102);

    circle(n*2.4+50,450,CNY[num[n]]*2);

  }

}

function getCovidData(data){

  let chinaCovid=data.China;

  let usCovid=data.US;

  rectMode(CENTER);

  fill(0,255,255)

  rect(textLocation[0],100,20,8);

  fill(204,204,255);

  rect(textLocation[0],120,20,8);

  fill(255,153,194);

  rect(textLocation[0],140,20,8);

  fill(255);

  rect(textLocation[0],160,20,8);

  fill(255);

  //textAlign(CENTER);

  textSize(9);

  text(": Covid-19 confirmed cases in US on listed date",textLocation[0]+12,102);

  text(": Covid-19 confirmed cases in China on listed date",textLocation[0]+12,122);

  text(": CNY conversion rate of 1 USD to CNY",textLocation[0]+12,142);

  text(": Date",textLocation[0]+12,162);

    //print(retrieveCode);

  fill(204,204,255);

  textAlign(CENTER);

  textSize(12);

  text(chinaCovid[retrieveCode[0]]["confirmed"],textLocation[0],400);

  text(chinaCovid[retrieveCode[1]]["confirmed"],textLocation[1],400);

  text(chinaCovid[retrieveCode[2]]["confirmed"],textLocation[2],400);

  text(chinaCovid[retrieveCode[3]]["confirmed"],textLocation[3],400);

  text(chinaCovid[retrieveCode[4]]["confirmed"],textLocation[4],400);

  text(chinaCovid[retrieveCode[5]]["confirmed"],textLocation[5],400);

  text(chinaCovid[retrieveCode[6]]["confirmed"],textLocation[6],400);

  text(chinaCovid[retrieveCode[7]]["confirmed"],textLocation[7],400);

  fill(0,255,255)

  text(usCovid[retrieveCode[0]]["confirmed"],textLocation[0],380);

  text(usCovid[retrieveCode[1]]["confirmed"],textLocation[1],380);

  text(usCovid[retrieveCode[2]]["confirmed"],textLocation[2],380);

  text(usCovid[retrieveCode[3]]["confirmed"],textLocation[3],380);

  text(usCovid[retrieveCode[4]]["confirmed"],textLocation[4],380);

  text(usCovid[retrieveCode[5]]["confirmed"],textLocation[5],380);

  text(usCovid[retrieveCode[6]]["confirmed"],textLocation[6],380);

  text(usCovid[retrieveCode[7]]["confirmed"],textLocation[7],380);

}

  //console.log(data);

​

​

​

​