Displaying two images in parallel

[jasmine...@gmail.com]

Hi Josh,

I am creating an experiment where two pictures should be displayed in parallel (ideally stacked on top of each other but could also be next to each other) and the user should make a keyboard response to choose either image (e.g., 'f' for left image, 'j' for right image). However, I can't find a suitable plugin. I tried to add a second stimulus to the single-stim plugin and to modify the keyboard-image and xab plugins but wasn't successful. Any simple suggestions?

Thanks so much!

[Josh de Leeuw]

Any of the plugins that allow you to insert HTML as the stimulus could work for this. If using the development version on GitHub, I would suggest using html-keyboard-response.

The trial might look like this

var trial = {

  type: 'html-keyboard-response',

  stimulus: '<img src="1.png" /><img src="2.png" />',

  choices: ['f',j']

}

You can modify the HTML in the stimulus parameter to allow for vertical or side-by-side display. 

Cheers,

Josh

--
You received this message because you are subscribed to the Google Groups "jsPsych" group.
To unsubscribe from this group and stop receiving emails from it, send an email to jspsych+u...@googlegroups.com.
To post to this group, send email to jsp...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/jspsych/a177f45d-5ff3-4f9b-aba7-e038f60337d9%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Ivette Colon]

Hi all,

I'm wondering how I could do the same format Jasmine mentioned, but I'm wondering how I could get this to display two random images given a pool of possible image paths. Does anyone have any insight?

Thanks!

[Becky Gilbert]

Hi Ivette,

You can do that using a dynamic parameter for the stimulus and jsPsych's randomization sampleWithoutReplacement function:

// set up the array of all images

var all images = ['1.png','2.png','3.png',42.png'];

var trial = {

  type: 'html-keyboard-response',

  stimulus: function() {

    var rand_images = jsPsych.randomization.sampleWithoutReplacement(all_images,2);

    return '<img src="' + rand_images[0]  + '" /><img src="' + rand_images[1]  + '" />';

  },

  choices: ['f',j']

};

Also, just FYI, the jsPsych support forum has moved to Github Discussions: https://github.com/jspsych/jsPsych/discussions so if you have any other questions, it'd be great if you could post there :)

Thanks!

Becky