Code not working in p5.js with JSON data?

p5.js Coding Questions
1

I’m trying to tell the system to let the number value stored within my JSON file to determine the size of the ellipse. I referenced this https://editor.p5js.org/bavazzanos1/sketches/Bkkdrs11M

MY CODE SO FAR:

var data; 
var instagram, snapchat, messenger, facebook, email;
var sizeMultiplier = 20; 
var Size;

function preload (){
  data =loadJSON ("Sunday.json");
}
function setup() {
   createCanvas (windowWidth, windowHeight);
   background (255);
   Size = data.oneam.instagram * sizeMultiplier;
   
   }
   
function draw () { 
background (220); 
fill (20, 40, 50); 
ellipse (width/2, height/2, Number(Size), Number(Size));

JSON FILE:

[
    { 
      "twelveam": {
        "instagram": 0,
        "messenger": 0,
        "snapchat": 0,
        "email": 0,
        "facebook": 0,
        "totalNotification": 0
          }
    },

    {
         "oneam": {
        "instagram": 1,
        "messenger": 2,
        "snapchat": 0,
        "email": 0,
        "facebook": 0,
        "totalNotification": 3
         }
    },
]

But I keep getting an error message in console
Screen Shot 2020-09-27 at 11.58.24 pm

Not sure what’s happened here?
Any feedback would be great!

1 Like
2

As I had already explained on your previous topic:

Your JSON file is a JSONArray of 2 JSONObject entries.

So you 1st need to specify the indexed entry number in order to access 1 of those JSONObject objects:
data[1].oneam.instagram or data[1]['oneam']['instagram']

2 Likes