Pavlovia - images are not displayed in their original size

Online experiments
1

In my PsychoPy Builder experiment the image sizes are left blank, to display images in their original sizes. The exp units are in heights, the image positions are read in from condition files (set in heights).
When I piloted on Pavlovia and simply left the size field blank, the images were larger. It is a problem as the task is a click->drag and drop one, measuring selection time amond other things. So the size, positioning should be perfectly the same as it is in the offline version. I tried to fix this issue in various ways, such as:

  • Retrieving the natural height and width of images in code and setting it (first Begin routine tab, then I tried Every Frame tab). I used: ObjectPic._image.naturalWidth and ObjectPic._image.naturalHeight
    to retrieve the original size in pixels then
    widthH = imgWidthPx / winHeightPx and heightH = imgHeightPx / winHeightPx then ObjectPic.size = [widthH, heightH]
    It did not work.
  • Setting spatial units filed to pix and inserting a code to convert image size to height units (Every Frame tab) - everything was displayed in the middle, as position was also interpreted in pixels, so I tried to
  • do the same as above but for image positions as well - did not solve the original issue
  • Calculating the height and width of all the images, adding size fields to my cvs condition files, setting obj size to a variable (every repeat).
    Result: some objects are distorted many are extremely small, despite the pixel sizes are correct. I am suspecting that I use the wrong formula (height in px/screen height in px; width in px/screen height in px - though I don’t get then why some object sizes seem okayish)
    I am doing this for days, diffing into this forum and other, so if someone could help me with very concrete suggestions, it would be great. @wakecarter
2

I use height units and the aspectRatio of each image and then set the size as

[aspectRatio * imageHeight, imageHeight]

where imageHeight is a constant – the proportion of the screen height desired, e.g. 0.8.

3

Hi @wakecarter, Thanks. I think I either don’t get it or I was not clear enough when describing the problem. In case it is the second:
When I did not manipulate everything the size of the images and their positioning was okay on the 1920 x 1080 res screen, independent of the screens actual size. Now, on Pavlovia, it is not (even when using the same screens). The original size of the images differ (and there is a reason for this, small differences matter, 60 x 90, 109 x 82 etc.etc.). I do not have anything like “desired size in height”. Or shall I just set sth and accept that images are not displayed in their original size, and things would look different in the online and offline version?

4

You could set the image component to use pixel units and have the original width and height in pixels in the spreadsheet.

Or you could calculate the pixels in height units (win.size[1]) and set imageHeight as imageHeightpixels / win.size[1].

As far as I’m aware you can’t just ask PsychoJS to display images “at original size”.

5

Hi,
there is definitely sth wrong w the conversion:
img height in height units = img height in px / win height in px;
img width = asp.ratio x img height (in height units).
I redid the condition files. The spatial units are set to heights in th experimenter settings and in the image components of Builder. It looks like this now:

image
image728×787 110 KB

I can try to set everything in px, but that also requires conversion (from height to px) as the image positions are defined in height units.

6

The image widths look too large. You could check them using print.

8

Hi @danna is this by any chance the Directors Task you are working on?

9

Hi, I committed the stupidest mistake possible…mixing up the order of width and height multiple times (in the python code that added the size to the condition files). Things look okayish now, except a bit of blurriness but I read that there is not much to do with it. Of course I have to check whether this - size read in from cond files - solution really works with other screens, for everyone.

10

Yes, kind of.