Code not working in p5.js with JSON data?

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

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