How to create this matrix?

Questions
1

I have an application in which people rate each item on two scales from 1 to 5 forming an x,y pair. What I need is to plot these results in a matrix, but without overlap. That is, if there are 2 or more items in the 3x3 pair, or 5x3 among others, I need to distribute them within the quadrant as shown in the image. That is, if hypothetically there are 9 items in 5x5, in the area of ​​the quadrant that represents 5x5 I need to place the 9 items so that they can be viewed without overlap. Thankssss

Graf_Exemplo2
Graf_Exemplo21350×606 89.4 KB

2

I built a demo here that should do the trick – click the squares to create ratings: https://coaching-sandbox.bubbleapps.io/version-test/rating-matrix?debug_mode=true

Editor: coaching-sandbox | Bubble Editor

I’m using a data type called “rating” to save the x/y point whenever you click a square.

There are 3 RGs here:

  • Outermost RG creates the X axis
  • First nested RG creates the Y axis
  • Next nested RG is the grid of dots to represent each rating for that x/y square, so no overlap.

Also note I added groups inside the X RG and Y RG to more easily reference the X/Y values when saving the rating and searching for ratings in the last RG.

I also added a button at the bottom to reset the matrix (aka delete the ratings)

This what you were going for?

Cheers,
Gaby
Coaching No Code Apps

3

Hiiii, yessss. I can do like you developed. Each People in a course will have to choose a XY square. And I can see the most voted… As you did, it is very simple and solve the problem. THANKSSSSSS BAGYYY

1 Like