How do I draw a circle based on my JSON data information in p5.js?

p5.js Coding Questions
2

Discourse.Processing.org/faq#format-your-code 
[
  {
    "12:00 am": {
      "instagram": 0,
      "messenger": 0,
      "snapchat": 0,
      "email": 0,
      "facebook": 0,
      "totalNotification": 0
    }
  },
  {
    "1:00 am": {
      "instagram": 1,
      "messenger": 2,
      "snapchat": 0,
      "email": 0,
      "facebook": 0,
      "totalNotification": 3
    }
  }
]

Given the JSON file is initially wrapped up w/ square brackets [] it means its outer datatype is JSONArray.

And you load & store that JSONArray in the variable data.

That JSONArray contains 2 entries wrapped up w/ curly brackets {}.
Thus those entries are of datatype JSONObject.

Seems like you wanna access the property messenger inside the 2nd JSONObject which contains a number value.

Each of those 2 JSONObject entries got 1 property which is a time string that points to another JSONObject.

The time string property from the 2nd JSONObject is named “1:00 am”.

So now we finally got all the “ingredients” in order to reach that number value 2:
const value = +data[1]['1:00 am'].messenger; // should grab value 2

We can also use the operator [] instead of . to access property messenger:
const value = +data[1]['1:00 am']['messenger']; // should grab value 2

If you need more JSON property access examples you can take a look at these 3 online sketches:



1 Like