Community Groups are officially here!
We've released Groups, a new feature that enables us to connect community members of similar industries and interests in a shared, private space. You can check out all of the details here, including information about who can join, how to join, and what Groups are currently offered. Please leave your feedback through this Community Groups Feedback Survey.

Seating chart with seat color depending on embedded data

maruiu
maruiu Community Member Qubie ✭
edited February 9 in Custom Code

Hello!

I would like respondents to see a seating chart with the distribution of booked/available seats drawn from different distributions, which vary with the treatment they are in. This means that two respondents in the same treatment will not necessarily get to see the exact same seating chart--rather, the chart has to be generated for each respondent (from the distribution for the respective treatment).

The number of possible seating arrangements is too big for it to be efficient to generate all images, include them in Files and then link them in the question. It seems that the only efficient way to do this is using JavaScript and jQuery. I do not know JavaScript; however, I have managed to find and run pieces of code to draw "true" random numbers from random.org (to generate the embedded data necessary for the distributions of booked/available seats). I have also found script that creates the seating chart here: https://www.jqueryscript.net/chart-graph/Minimalist-Seating-Chart-Plugin-with-jQuery-flexiSeats.html. I need a hand to understand how I can use this linked code in Qualtrics, as my attempts until now have failed.

Thanks in advance!

Tagged:

Best Answer

  • wscampbell
    wscampbell Community Member Qubie ✭
    edited February 9 Accepted Answer

    Here's a very hacky way you could do this that is *definitely* not ideal but may help if you can't find anything better:

    1. Upload 2 image files to your Qualtrics library, 1 for the available seat and 1 for the occupied seat.
    2. In the Image Library, find each picture and click the Gear icon to get the image URL.
    3. Generate a matrix of distributions.* (will return to this below)
    4. In your survey, wherever you want the seating chart image to appear, turn on Loop & Merge for that block, and paste in your Matrix from (3) to the L&M table. Set the L&M options to Randomize and present only 1 row.
    5. In that block, create a question to display the seating chart. If, for instance, you had 20 seats, you could use Rich Text Editor to make a 4x5 table.
    6. In each cell of the table, input the placeholder for a L&M data: ${lm://Field/n}. In other words, in the first cell you'd put ${lm://Field/1}, in the second cell ${lm://Field/2}....${lm://Field/20}

    That should get you what you want, but it's a terribly tedious and inelegant solution. Hopefully someone will chime in with a JS solution for you!

    *3. Generating your seating matrix

    You can use L&M to present images using the following code: <img src="yourURLhere"> (get the URL rom step 2, above). You'll type this code into the L&M table, but participants will see the image to which it refers.

    Use a program (R, Excel, whatever) to randomly generate distributions of available & unavailable seats. Each seat option (available or unavailable) will have its associated <img src="yourURL"> value (per step 2, above). In the example above, you'd generate X rows where each row is a distribution of 20 seats (where X is the total number of randomizations from which you'll draw).

    Then, copy>paste this matrix into your L&M table. Each row represents a distribution of seats, each cell is filled with a link to a corresponding image, and each participant will only see 1 row (i.e., 1 distribution).


    Good luck!

Answers

  • ahmedA
    ahmedA IndiaCommunity Member, XMPN Member Wizard ✭✭✭✭✭
  • maruiu
    maruiu Community Member Qubie ✭

    Thanks for the suggestion, @wscampbell ! I tried it, but I get an error about exceeding the character limit per question. I'll have to think of another way to ask the question and to implement it.

  • wscampbell
    wscampbell Community Member Qubie ✭

    You get this error when making the table in Rich Text editor?

    How many seats are there? Also, just to verify, each cell in the table you create in the Rich Text editor should be filled with ${lm://Field/n} and not `<img src="yourURL">`.

  • maruiu
    maruiu Community Member Qubie ✭

    Hi again, @wscampbell , and sorry for the late reply--I was quite busy lately. I have probably made the mistake you refer to.

    In the end, my coauthor and I decided to show information differently to participants (as researchers, we are free to implement whatever best fits our research questions--and programming abilities). However, parts of your suggested solution using Loop and Merge are still relevant for what we decided to do.

    So thank you once again!