Show single item from collection in repeater based on vector image click

Hi all,

I’ve designed a webpage for a client whereby a map is interactive to show information about buildings on their site when you click on each building.
A PDF image is embedded onto the webpage with vector images (transparent) placed over buildings on the map.

At the moment it works, but it is an absolute pain to update annually and i would like to streamline this. I have 5000+ lines of code simply doing the .show and .hide function, for 70+ different buildings(vector images). The relevant Information for each is then in a repeater which i have manually typed in (so i have 70+, default hidden, text boxes overlapping.)

Going forward instead of manually holding the data in overlapped, hidden fields, i would like to store them in a collection and pull data from there. This will save me a huge amount of time everytime something needs to be updated.

There is obviously a better way to do this than my current method, but for the life of me I just cannot get it to work and i am losing sleep over it. It should be so simple…

What I would like/need some help with:

  • Vector image is clicked (labelled ‘dec1’)
  • Information in my repeater shows data from a collection from a row with the same title as the label of the vector image
    -This will be ‘building name’, ‘building postcode’, ‘building address’… etc (about 10 different columns of data)

I tried something like this (below), thinking I could do 70 of them for each vector image (dec1, dec2, dec3 etc). I know there is an even easier way to do this without having to duplicate the code 70 times but i’m still getting my head around the essentials in this :frowning:
I would be so grateful if someone could help me get this to work in a way that at least pulls from my collection, even without it being the least lines of code!

export function dec1_click ( event ) {
$w ( “#dataset1” ). setFilter ( wixData . filter ()
. eq ( “tags” , “dec1” ));

export function dec2_click ( event ) {
$w ( “#dataset1” ). setFilter ( wixData . filter ()
. eq ( “tags” , “dec2” ));

     export function  dec2_click ( event ) { 
 $w ( "#dataset1" ). setFilter ( wixData . filter () 
     . eq ( "tags" ,  "dec2" )); 


Can anyone help me to see what on earth i am doing wrong or missing? :tired_face:
(p.s i thought i could use this example: however i don’t want to display selection tags in this way)

FYI - I have this working in my .show and .hide method which works and has been workign fine for the last 4 years.
There is currently no connection to a dataset.
I have worked with datasets before for another client successfully, but it was not pulling the information in the same way as this.

Many many many MANNNYYY thanks in advance!