Multiple radio button group to show corresponding picture

Ask the community
,
1

Hello,

I have 3 groups of 2 radio butons :
Sex : Male / Female
Age : Young / Old
Size : Little / Tall

It makes 8 possible combinations (2^3).
I have 8 pictures, one for each combination, for example MaleOldLittle.png, FemaleOldTall.png, etc.

I need to display the picture corresponding to the user selection.
For example, display picture MaleYoungTall.png when Male and Young and Tall are checked.

How can I do it ?

Thank you very much !

2 
let imageSource = [
"wix:image://v1/11062b_0d8a1f8a111244718b046716bb76a153~mv2.jpg/_.jpg#originWidth=1920&originHeight=1080",
"wix:image://v1/11062b_c9a1dc09fd844d2aa4260444ff9af9d4~mv2.jpg/_.jpg#originWidth=1920&originHeight=1080",
"wix:image://v1/11062b_0d8a1f8a111244718b046716bb76a153~mv2.jpg/_.jpg#originWidth=1920&originHeight=1080",
"wix:image://v1/11062b_c9a1dc09fd844d2aa4260444ff9af9d4~mv2.jpg/_.jpg#originWidth=1920&originHeight=1080",
"wix:image://v1/11062b_0d8a1f8a111244718b046716bb76a153~mv2.jpg/_.jpg#originWidth=1920&originHeight=1080",
"wix:image://v1/11062b_c9a1dc09fd844d2aa4260444ff9af9d4~mv2.jpg/_.jpg#originWidth=1920&originHeight=1080",
"wix:image://v1/11062b_0d8a1f8a111244718b046716bb76a153~mv2.jpg/_.jpg#originWidth=1920&originHeight=1080",
"wix:image://v1/11062b_c9a1dc09fd844d2aa4260444ff9af9d4~mv2.jpg/_.jpg#originWidth=1920&originHeight=1080",
];//use the source of your 8 images
let cases = ["0,0,0", "0,0,1", "0,1,1", "1,0,0", "1,1,0", "1,0,1", "1,1,1", "0,1,0"]//order it so its index number will fit the imageSources array. first number in each string is the choice in radio1 etc (0 is the first option)..
$w.onReady(function () {
    $w("#radioGroup1, #radioGroup2, #radioGroup3").onChange((event) => {
         let inx1 = $w("#radioGroup1").selectedIndex;
         let inx2 = $w("#radioGroup2").selectedIndex;
         let inx3 = $w("#radioGroup3").selectedIndex;
         let selection = `${inx1},${inx2},${inx3}`;
         $w("#image1").src = imageSource[cases.indexOf(selection)];
    })
});