let loaded = false;

let earthquakeMag=0;

let earthquakeName;

let earthquakeSig;

let x = 50;

let y = 50;

​

function setup() {

  createCanvas(300,300);

  textAlign(CENTER);

  background(200,100,39);

}

​

function draw() {

  //background(100+earthquakeMag*20,200-earthquakeMag*20,0);

  drawEarthquake();

}

​

function keyPressed() {

  if (key == 'l') loadJSON(url, getEarthquake);

}

​

function getEarthquake(earthquakes) { // Get the magnitude and name of the earthquake out of the loaded JSON

  earthquakeMag = earthquakes.features[0].properties.mag;

  earthquakeName = earthquakes.features[0].properties.place;

    earthquakeSig = earthquakes.features[0].properties.sig;

  loaded = true;

  print(earthquakeMag,earthquakeName);

}

​

function drawEarthquake() {

  if (loaded) {

    circle(earthquakeSig,earthquakeSig,  earthquakeMag * 10);

    text(earthquakeName+"\n"+earthquakeMag, 0, height - 40, width, 30);

   /*x = x + 1; 

    if (x > 35 && x < 100 )

      {print('here ya go');

      x = x + -1; }*/

​

  } else text("click canvas\nuse key [l] for update", width/2 +10, height/2 +10);

}