# Using json data to change colour

**URL:** <https://discourse.processing.org/t/using-json-data-to-change-colour/27958>\
**Category:** Processing.py\
**Created:** [February 20, 2021, 7:16pm UTC](https://discourse.processing.org/t/using-json-data-to-change-colour/27958 "2021-02-20T19:16:02Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![fleshcircuit](https://avatars.discourse-cdn.com/v4/letter/f/b3f665/32.png) [@fleshcircuit](https://discourse.processing.org/u/fleshcircuit)\
**Post date:** [February 20, 2021, 7:16pm UTC](https://discourse.processing.org/t/using-json-data-to-change-colour/27958/1 "2021-02-20T19:16:02Z")

</div>

Hello,

I am trying to create a sketch that uses from a json file to r value to change colour. In the terminal, it shows the value changing, but the colour are not changing. Here is code:

```auto
import json

def setup():
    size(720,480)
    global jsondata, heart
    jsondata = open('heart_rate-2020-09-11.json')
    heart = json.load(jsondata)
    
def draw():
    for beat in heart:
        bpm = beat['value']['bpm']
        print(bpm)
        fill(bpm, 0, 0)
        circle(width/2, height/2, 200)

```

---

<div class="post-metadata">

**Author:** ![fleshcircuit](https://avatars.discourse-cdn.com/v4/letter/f/b3f665/32.png) [@fleshcircuit](https://discourse.processing.org/u/fleshcircuit)\
**Post date:** [February 20, 2021, 7:40pm UTC](https://discourse.processing.org/t/using-json-data-to-change-colour/27958/2 "2021-02-20T19:40:30Z")

</div>

I realise why it was not changing. It was making a circle for each value and putting them all on top of each other. How do I enable it to read through each value one at a time?

---

<div class="post-metadata">

**Author:** ![tabreturn](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tabreturn/32/3697_2.png) [@tabreturn](https://discourse.processing.org/u/tabreturn)\
**Post date:** [February 20, 2021, 10:38pm UTC](https://discourse.processing.org/t/using-json-data-to-change-colour/27958/3 "2021-02-20T22:38:57Z")

</div>

Welcome, @fleshcircuit

Yes – every circle is drawn over the last one. You only see the final circle drawn on each frame.

You want to draw one circle per frame; you’re drawing several each frame. I don’t know what your JSON data looks like, so I’ve created some placeholder dictionary values. I’m using a [modulo operation](https://py.processing.org/reference/modulo.html) with the [frameCount](https://py.processing.org/reference/frameCount.html) to pick row values:

```auto
def setup():
    frameRate(3) # slow down frame rate to see what's happening
    
    size(720,480)
    global jsondata, heart
    heart = [
      {'value': {'bpm': 0}},
      {'value': {'bpm': 100}},
      {'value': {'bpm': 200}},
    ]
    
def draw():
    background(255, 255, 255) # clear previous frame
    heart_total = len(heart) # total entries in heart data
    heart_row = frameCount % heart_total # pick a row
    
    bpm = heart[heart_row]['value']['bpm']
    print(bpm)
    fill(bpm, 0, 0)
    circle(width/2, height/2, 200)

```

The `heart_row` is equal to `1` on the first frame, `2` on the second. Then it ‘wraps back around’ to `0` again for the third frame, and so on.

---

<div class="post-metadata">

**Author:** ![fleshcircuit](https://avatars.discourse-cdn.com/v4/letter/f/b3f665/32.png) [@fleshcircuit](https://discourse.processing.org/u/fleshcircuit)\
**Post date:** [February 21, 2021, 11:22am UTC](https://discourse.processing.org/t/using-json-data-to-change-colour/27958/4 "2021-02-21T11:22:53Z")

</div>

Thank you! I will try it out.