week8_data.js

//// LOAD STRINGS PRELOAD

var lines;

function preload() {
  lines = loadStrings("lines.txt");
}

function setup() {
  createCanvas(600, 400);
  //lines = loadStrings("lines.txt"); // doesn't load in time
  textSize(20);
  fill(0);
  noLoop();
}

function draw() {
  background(0, 150, 250);
  for (var i=0; i<lines.length; i++) {
    text(lines[i], 5, 20*i+20);
  }
}




//// LOAD STRINGS - CALLBACK

var lines;

function preload() {
  lines = loadStrings("lines.txt");
}

function setup() {
  createCanvas(600, 400);
  //lines = loadStrings("lines.txt"); // doesn't load in time
  textSize(20);
  fill(0);
  noLoop();
}

function draw() {
  background(0, 150, 250);
  for (var i=0; i<lines.length; i++) {
    text(lines[i], 5, 20*i+20);
  }
}

//// LOAD TABLE PRELOAD

var stats;

function preload() {
  stats = loadTable("ortiz.csv");
}

function setup() {
  createCanvas(600, 400);
  for (var i = 0; i < stats.getRowCount(); i++) {
    // Gets the value from row i, column 0 in the file
    var year = stats.get(i, 0);
    // Gets the value from row i, column 1
    var homeRuns = stats.get(i, 1);   
    var rbi = stats.get(i, 2);
    var average = stats.get(i, 3); 
    print(year, homeRuns, rbi, average);
    text(year+', '+homeRuns+', '+rbi+', '+average, 50, 50+50*i);
  }
}

//// LOAD TABLE - PRELOAD w GRAPH
var stats;
var homeRuns = [];

function preload() {
  stats = loadTable("assets/ortiz.csv");
}

function setup() {
  createCanvas(600, 400);
  var rowCount = stats.getRowCount();
  homeRuns = [];
  for (var i = 0; i < rowCount; i++) {
    homeRuns[i] = stats.getNum(i, 1);   
  }
}

function draw() {
  background(204);
  // Draw background grid for data
  stroke(153);

  var interval = width/homeRuns.length;
  for (var i = 0; i < homeRuns.length; i++) {
    var x = interval*i;
    line(x, 0, x, height);
  }

  // Draw lines based on home run data
  noFill();
  stroke(0);
  beginShape();
  for (var i = 0; i < homeRuns.length; i++) {
    var x = interval*i;
    var y = map(homeRuns[i], 0, 60, 0, height);
    vertex(x, y);
  }
  endShape();
}


//// LOAD JSON - PRELOAD
var data;

function preload() {
  data = loadJSON("data.json");
}

function setup() {
  createCanvas(600, 400);
  noLoop();
  noStroke();
  textSize(20);
}

function draw() {
  console.log(data);
  background(120, 180, 200);


  //
  // You can access JSON values by using a '.' followed by the key
  //
  // data.person1.name = "Morgan"
  // data.person2.name = "Joss"
  //

  // person 1 bubble
  fill(155, 30, 180, 180);
  ellipse(250, 200, data.person1.age * 5, data.person1.age * 5); // person1.age = 30
  fill(255);
  text(data.person1.name, 210, 200); // person1.name = Morgan

  // person 2 bubble
  fill(180, 180, 34, 180);
  ellipse(350, 200, data.person2.age * 5, data.person2.age * 5); // person2.age = 32
  fill(255);
  text(data.person2.name, 330, 200); // person2.name = Joss
}


//// LOAD JSON 2
var film;

function preload() { 
  film = loadJSON("film.json");
}

function setup() {
  noCanvas();
  var title = film.title;
  var dir = film.director;
  var year = film.year;
  var rating = film.rating;
  createP(title + " by " + dir + ", " + year + ". Rating: " + rating);
}

//// OPEN WEATHER MAP NY

var bubbles = [];

function setup() {
  var url = 'http://api.openweathermap.org/data/2.5/weather?q=NewYork,USA&APPID=YOUR_API_KEY';
	loadJSON(url, drawWeather); 

  createCanvas(600, 400);
  noLoop();
  noStroke();

}

function draw() {

}

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);
  }
}

//// WEATHER WEEKLY
var url = "http://api.openweathermap.org/data/2.5/forecast/daily?lat=35&lon=139&cnt=10&mode=json&APPID=YOUR_API_KEY";

function setup() {
  createCanvas(windowWidth, windowHeight);
  loadJSON(url, handleData);
}

function handleData(data) {
  console.log(data.list);

  for (var i=0; i<data.list.length; i++) {

    var numClouds = data.list[i].clouds;
    var humidity = data.list[i].humidity;

    fill(200, 50, 100, humidity);
    ellipse(i*100+50, height/2, numClouds, numClouds);
    text("day "+i, i*100+50, height/2);
  }
}

//// WEATHER ANIMATION
var x = 300;
var y = 300;
var speed = 0;
var input;
var button;
var url = "http://api.openweathermap.org/data/2.5/weather?APPID=YOUR_API_KEY&q=";

function setup() {
  createCanvas(windowWidth, windowHeight);
  background(200);

  input = createInput();
  input.position(50, 50);

  button = createButton("submit");
  button.position(50, 80);
  button.mousePressed(updateData);
}

function draw() {
  background(200);
  ellipse(x, y, 50, 50);
  x += speed;
}

function handleData(weatherData) {
  speed = weatherData.wind.speed;
}

function updateData() {
  var city = input.value(); // text in the box
  console.log(city);
  // a loadJSON to get latlon from city
  loadJSON('https://maps.googleapis.com/maps/api/geocode/json?address='+encodeURI(city), function(data) {
    // get lat and lon
    // call the second loadJSON to get images
  });

  //var city = "NewYork,USA";
  loadJSON(url+city, handleData);
  x = 300;
}

//// NYTIMES
function setup() {
  noCanvas();
  noLoop();
  noStroke();
  fill(0);
  var url = "http://api.nytimes.com/svc/search/v2/articlesearch.json?q=obama&api-key=sample-key";
  loadJSON(url, showSnippets);
}


function showSnippets(data) {
  console.log(data);
  var docs = data.response.docs;
  for (var i=0; i<docs.length; i++) {
    createP(docs[i].snippet);
  }
}