Display images using code component online

Online experiments
1

Hi all,

I am trying to run an online experiment. I would like to display images after a condition is met (this code is ready). I couldn’t find any documentation on how to approach this in JS. Any advice would be welcomed.

2

Create the image components in the builder on the trial on which you want them to appear, make it so they are never displayed by default, and in your code component, in the each frame tab, put something like this:

if (condition==true){
  image.setAutoDraw=true;
}
3

Hey @jonathan.kominsky. Unfortunately, this doesn’t work.I have several images on this routine and it always displays the one being at the bottom regardless of the code.

5

It sounds like it’s rendering all of them and just showing you the one on top. In that case, you might have to manually set setAutoDraw false for all of them and then set it true just for the one you want.

6

I managed to solve that by creating the images in the begin experiment tab, display them using .setAutoDraw(true); in the begin routine tab and then setting them to false in the end routine tab. Thanks, once again!

1 Like