# Online RGBA support

**URL:** <https://discourse.psychopy.org/t/online-rgba-support/24410>\
**Category:** Online experiments\
**Created:** [August 5, 2021, 11:58am UTC](https://discourse.psychopy.org/t/online-rgba-support/24410 "2021-08-05T11:58:29Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![TimCottier](https://avatars.discourse-cdn.com/v4/letter/t/87869e/32.png) [@TimCottier](https://discourse.psychopy.org/u/TimCottier)\
**Post date:** [August 5, 2021, 11:58am UTC](https://discourse.psychopy.org/t/online-rgba-support/24410/1 "2021-08-05T11:58:30Z")

</div>

Hi all!  
I was wondering if the colour of polygon components can be specified in RGBA for Pavlovia experiments?

I keep getting this error:  
“The argument should be an array of numbers of length 3”.  
This error disappears when I delete the alpha channel.

I am trying to hold the colour of two circle polygon components constant at black, and vary their luminance by varying the alpha value:

> ContinuousCirc.setFillColor([-1, -1, -1, alpha])  
> ContinuousCirc.setLineColor([-1, -1, -1, alpha])

Is there any other way I can manipulate the luminance of a polygon component?

---

<div class="post-metadata">

**Author:** ![Becca](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.psychopy.org/becca/32/34260_2.png) [@Becca](https://discourse.psychopy.org/u/Becca)\
**Post date:** [August 5, 2021, 12:07pm UTC](https://discourse.psychopy.org/t/online-rgba-support/24410/2 "2021-08-05T12:07:46Z")

</div>

Hi There,

Because polygons are rendered online using pixi you could use

```auto
polygon._pixi.alpha = 0.5

```

in a code component - but it might be easier to manipulate the opacity parameter?

Thanks!  
Becca

---

<div class="post-metadata">

**Author:** ![TParsons](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.psychopy.org/tparsons/32/8301_2.png) [@TParsons](https://discourse.psychopy.org/u/TParsons)\
**Post date:** [August 5, 2021, 12:54pm UTC](https://discourse.psychopy.org/t/online-rgba-support/24410/3 "2021-08-05T12:54:05Z")

</div>

We’re working on bringing PsychoJS more in line with PsychoPy in general, and colours are an area we’re particularly focused on. RGBA works in python so hopefully soon we’ll be able to match that in JS 🙂

Until then, the solution Becca proposes should work just the same.

---

<div class="post-metadata">

**Author:** ![TimCottier](https://avatars.discourse-cdn.com/v4/letter/t/87869e/32.png) [@TimCottier](https://discourse.psychopy.org/u/TimCottier)\
**Post date:** [August 5, 2021, 1:41pm UTC](https://discourse.psychopy.org/t/online-rgba-support/24410/4 "2021-08-05T13:41:51Z")

</div>

Thank you both for the really quick replies, I really appreciate it!

Unfortunately, it’s not working on my end. I am getting this error:

> **TypeError: Cannot set property ‘alpha’ of undefined.**

The console identifies this code as the issue:

```auto
 flash._pixi.alpha = FlashLum;

```

Without any changes in outcome, I have tried this line of code in the begin routine and each frame sections of a code component. I have also tried running it as: `flash.pixi.alpha = FlashLum`

I am a bit confused about why it thinks the polygon component is undefined when Becca’s line of code is inserted, as that code belongs to this block of code, which executes successfully in its absence:

```auto
    flash.setLineColor([0, 0, 0]);
    flash.setFillColor([0, 0, 0]);
    flash._pixi.alpha = FlashLum;
    thisExp.addData("FlashLuminance", FlashLum);

```

---

<div class="post-metadata">

**Author:** ![Becca](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.psychopy.org/becca/32/34260_2.png) [@Becca](https://discourse.psychopy.org/u/Becca)\
**Post date:** [August 5, 2021, 2:08pm UTC](https://discourse.psychopy.org/t/online-rgba-support/24410/5 "2021-08-05T14:08:37Z")

</div>

Where are you adding the code to at the moment? (e.g. which tab?)

---

<div class="post-metadata">

**Author:** ![TimCottier](https://avatars.discourse-cdn.com/v4/letter/t/87869e/32.png) [@TimCottier](https://discourse.psychopy.org/u/TimCottier)\
**Post date:** [August 5, 2021, 2:26pm UTC](https://discourse.psychopy.org/t/online-rgba-support/24410/6 "2021-08-05T14:26:03Z")

</div>

At the moment I am storing it in Begin Routine. Here’s a screenshot:

 ![image](https://us1.discourse-cdn.com/flex002/uploads/psychopy/original/3X/7/4/74edd05fa6b03fbedec650da2cd8b8e26b4a1c3c.png)

---

<div class="post-metadata">

**Author:** ![Becca](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.psychopy.org/becca/32/34260_2.png) [@Becca](https://discourse.psychopy.org/u/Becca)\
**Post date:** [August 5, 2021, 2:46pm UTC](https://discourse.psychopy.org/t/online-rgba-support/24410/7 "2021-08-05T14:46:22Z")

</div>

if you comment out line 15 and use `window.flash = flash` then open the console whilst running your task in browser can you inspect if flash has the attribute `._pixi`?

alternatively is the code component rendered before or after your polygon in the routine?

Becca

---

<div class="post-metadata">

**Author:** ![TimCottier](https://avatars.discourse-cdn.com/v4/letter/t/87869e/32.png) [@TimCottier](https://discourse.psychopy.org/u/TimCottier)\
**Post date:** [August 6, 2021, 2:03am UTC](https://discourse.psychopy.org/t/online-rgba-support/24410/8 "2021-08-06T02:03:04Z")

</div>

When I type in flash into the console, `._pixi` becomes a suggested fill-in option.  
However, when I enter `flash._pixi` into the console, it comes up undefined. I have attached a screenshot below.

 ![image](https://us1.discourse-cdn.com/flex002/uploads/psychopy/original/3X/f/0/f00694cea0b0a77331f0498462a997f287f02217.png)

I believe the code component is rendered before the polygon, as I am trying to change/set the alpha before the first frame is drawn. However, in the screenshot above, the error caused by `flash._pixi.alpha` is in the each flash tab, and should only be altering the alpha of an already rendered flash.

---

<div class="post-metadata">

**Author:** ![Becca](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.psychopy.org/becca/32/34260_2.png) [@Becca](https://discourse.psychopy.org/u/Becca)\
**Post date:** [August 6, 2021, 8:39am UTC](https://discourse.psychopy.org/t/online-rgba-support/24410/9 "2021-08-06T08:39:36Z")

</div>

That’s weird! can you use the opacity field of the polygon instead? that should achieve the same thing?

Becca

---

<div class="post-metadata">

**Author:** ![TimCottier](https://avatars.discourse-cdn.com/v4/letter/t/87869e/32.png) [@TimCottier](https://discourse.psychopy.org/u/TimCottier)\
**Post date:** [August 9, 2021, 7:57am UTC](https://discourse.psychopy.org/t/online-rgba-support/24410/10 "2021-08-09T07:57:42Z")

</div>

Thank you so much for your help Becca! Turns out opacity will do exactly what I need!

---

<div class="post-metadata">

**Author:** ![Becca](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.psychopy.org/becca/32/34260_2.png) [@Becca](https://discourse.psychopy.org/u/Becca)\
**Post date:** [August 9, 2021, 7:59am UTC](https://discourse.psychopy.org/t/online-rgba-support/24410/11 "2021-08-09T07:59:28Z")

</div>

fabulous! that should be much easier too!

Good luck with your study!  
Becca