Old school D3 from simpler times

All examples By author By category About

Yannael

Full window Github gist

OpenFoodFact

Built with blockbuilder.org

forked from Yannael's block: fresh block

forked from Yannael's block: fresh block

forked from Yannael's block: fresh block

forked from Yannael's block: fresh block

forked from Yannael's block: fresh block

forked from Yannael's block: OpenFoodFact

<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.4.23/p5.min.js"></script>
</head>

<body>
  <script>
function setup() {
  createCanvas(640, 480);
 var url = 'https://api.openweathermap.org/data/2.5/weather?APPID=81ebc63f8b56bfcf22d04eb32c223d8e&q=Moscow,RU'
  loadJSON(url, drawWeather); 
}

function draw() {
  
   textSize(30);
  //textColor(45)
  //text("a",10,30)
   s = "The quick brown fox jumped over the lazy dog.";
//fill(50);
text(s, 20, 20);
  //ellipse(mouseX, mouseY, 80, 80);
}
    
    function drawWeather(weather) {

// Get the loaded JSON data
  console.log(weather); // inspect the weather JSON
  var humidity = weather.main.humidity; // get the main.humidity out of the loaded JSON
  console.log(humidity); // inspect the humidity in the console

background(40, 90, 200);
  fill(0, 255, 255, humidity); // use the humidity value to set the alpha
  for (var i = 0; i < 50; i++) {
    ellipse(random(width), random(height), 30, 30);
  }
}

</script>
</body>

xxxxxxxxxx
 
<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.4.23/p5.min.js"></script>
</head>
​
<body>
  <script>
function setup() {
  createCanvas(640, 480);
 var url = 'https://api.openweathermap.org/data/2.5/weather?APPID=81ebc63f8b56bfcf22d04eb32c223d8e&q=Moscow,RU'
  loadJSON(url, drawWeather); 
}
​
function draw() {
  
   textSize(30);
  //textColor(45)
  //text("a",10,30)
   s = "The quick brown fox jumped over the lazy dog.";
//fill(50);
text(s, 20, 20);
  //ellipse(mouseX, mouseY, 80, 80);
}
    
    function drawWeather(weather) {
​
  // Get the loaded JSON data
  console.log(weather); // inspect the weather JSON
  var humidity = weather.main.humidity; // get the main.humidity out of the loaded JSON
  console.log(humidity); // inspect the humidity in the console
​
  background(40, 90, 200);
  fill(0, 255, 255, humidity); // use the humidity value to set the alpha
  for (var i = 0; i < 50; i++) {
    ellipse(random(width), random(height), 30, 30);
  }
}
​
  </script>
</body>
​
    

https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.4.23/p5.min.js