13_data_code.js

///////////////////////////////////////////////////// p5.js

var data;
var x = 100;
var y = 200;

function preload() {
  data = loadTable('results.csv', 'header');
}

function setup() { 
  createCanvas(windowWidth, windowHeight);
  print(data);
  noLoop();
}

function draw() { 
  background(220);
  
  for (var i=0; i<data.getRowCount(); i++) {
    var answer = data.get(i, 1);
    var age = data.get(i, 2);
    text(age, x, y);
    text(answer, x, y, 200, 200);
    y = y + 200;
  }
}

///////////////////////////////////////////////////// sheetsu
// This example uses google spreadsheets and https://sheetsu.com/

var data;
var x = 100;
var y = 200;

function preload() {
  data = loadJSON('https://sheetsu.com/apis/v1.0bu/c4d11ae3cd0d');
}

function setup() { 
  createCanvas(windowWidth, windowHeight);
  print(data);
  noLoop();
}

function draw() { 
  background(220);
  
  for (var i=0; i<data.length; i++) {
    var answer = data[i]["Answer.summary"];
    var age = data[i]["Answer.age"];
    text(age, x, y);
    text(answer, x, y, 600, 200);
    y = y + 100;
  }
}



///////////////////////////////////////////////////// sheetsu input
// This example uses google spreadsheets and https://sheetsu.com/

var data;
var x = 100;
var y = 300;
var input;
var button;

function preload() {
  data = loadJSON('https://sheetsu.com/apis/v1.0/1ff4440cd45a');
}

function setup() { 
  createCanvas(windowWidth, windowHeight);
  
  // create input text field
  input = createInput();
  input.position(100, 100);
  input.size(400, 20);
  
  // create button
  button = createButton('submit');
  button.position(100, 130);
  button.mousePressed(submitResponse);
  
  print(data);
  noLoop();
}

function draw() { 
  background(220);
  
  for (var i=0; i<data.length; i++) {
    var answer = data[i].summary;
    var age = data[i].age;
    text(age, x, y);
    text(answer, x+15, y);
    y = y + 30;
  }
}

function submitResponse() {
  var response = input.value();
  print(response);
  text(response, x, y);
  y = y + 30;
}


///////////////////////////////////////////////////// sheetsu update
function submitResponse() {
  var response = input.value();
  var d = {summary: response, age: 100};
  httpPost(url, d);
}


///////////////////////////////////////////////////// jquery sheetsu
$(document).ready(function() {

  var data;

  $.getJSON('https://sheetsu.com/apis/v1.0/1ff4440cd45a', handleData);
  
  function handleData(data) {
  
    for (var i=0; i<data.length; i++) {
      var answer = data[i].summary;
      var age = data[i].age;
      console.log(answer);
      
      $('#responses').append('<p>'+answer+'</p>');
    }
  }
  
});