Hi Everyone,
I’m using the Google Maps component to display a list of locations and I’d like to differentiate pin colors based on whether a location is open or closed. From a design perspective, how can I achieve this? (I’m using Xano as a backend.) (ex: red if open, grey if closed)
Thanks for your help!
Hey @Davy 
On your Google Maps settings, you have this Custom markers toggle. If you enable that, on your markers configuration, you’ll have a new Marker icon field. This field lets you pick a custom marker image.
Now, the remaining issue would be how to conditionnally pick the active pin or the inactive pin. I’m seeing 2 ways of doing that:
In Xano (if your data is dynamic)
On your GET endpoint, you’ll want to return an additional key isOpened, that should have the value of a pin url depending on the opening hours. Basically in a function, you’ll want to check if the current hour is between the opening hours.
In Weweb
You’ll want to modify your marker’s array to add the isOpened key to each object, and depending on the same condition, add the correct pin image url as a value.
Hope that helps!
Thank you for your help. All good I managed to make it work!
