Hello! I’m working on a FlutterFlow project using Google Maps and ListView. I have backend data structured as follows:
[
{
"customerId": 8,
"customerName": "Akasya Mall",
"locationId": 1,
"locationName": "Akasya Mall",
"location": {
"latitude": 41.001381,
"longitude": 29.054864
},
"distanceKm": 0.9194653522132363,
"workingHours": "08:00-17:00"
},
{
"customerId": 9,
"customerName": "Emaar Square Mall",
"locationId": 2,
"locationName": "Emaar address",
"location": {
"latitude": 41.003424,
"longitude": 29.071344
},
"distanceKm": 0.5836609574376709,
"workingHours": "08:00-17:00"
}
// other records...
]
What I’ve Done:
I used a custom function to convert the
location
field in this data into aLatLng<List>
, and I’m displaying these on Google Maps as markers.I’m showing the additional details from the backend data (e.g.,
customerName
,distanceKm
, etc.) in a ListView, where each card represents one data entry.
Goal: When a marker on the map is tapped, I’d like to automatically scroll the ListView to the card that corresponds to that marker, based on the latitude
and longitude
.
Could you advise on how to identify the matching card in the ListView by comparing latitude
and longitude
values, and then programmatically scroll to it? Any help would be greatly appreciated! 🙏