How to place markers dynamically from API to google map in flutter?

623 views Asked by At
class LiveVehicleTrackingModel {
double lat;
double lng;
int speed;
double refDist;
String refLoc;
String accStatus;
String recDateTime;
String driver;
double temperature;
String imoblize;

LiveVehicleTrackingModel(
  {this.lat,
    this.lng,
    this.speed,
    this.refDist,
    this.refLoc,
    this.accStatus,
    this.recDateTime,
    this.driver,
    this.temperature,
    this.imoblize});

 LiveVehicleTrackingModel.fromJson(Map<String, dynamic> json) {
 lat = json['lat'];
 lng = json['lng'];
 speed = json['speed'];
 refDist = json['refDist'];
 refLoc = json['refLoc'];
 accStatus = json['accStatus'];
 recDateTime = json['recDateTime'];
 driver = json['driver'];
 temperature = json['temperature'];
 imoblize = json['Imoblize'];
 }

 Map<String, dynamic> toJson() {
 final Map<String, dynamic> data = <String, dynamic>{};
 data['lat'] = lat;
 data['lng'] = lng;
 data['speed'] = speed;
 data['refDist'] = refDist;
 data['refLoc'] = refLoc;
 data['accStatus'] = accStatus;
 data['recDateTime'] = recDateTime;
 data['driver'] = driver;
 data['temperature'] = temperature;
 data['Imoblize'] = imoblize;
 return data;
 }
 }


  // This is where i am getting location from the Api.

  Future<List<LiveVehicleTrackingModel>> getLocations() async {
  try {
  var url = ApiConstants.liveTrackingApi;
  final resp = await http.post(Uri.parse(url));
  final responsebody = jsonDecode(resp.body);
  return responsebody;
} catch (e) {
  return [];
}

}

// This is the first question where i am loading locations with the help of model class.

// List locations = []; LatLng latlng;

  loadLocations() async {
  List<LiveVehicleTrackingModel> locations;
  locations = [];
  locations = await getLocations(); //we store the response in a list
  for (var i = 0; i < locations.length; i++) {
  // LatLng latlng;
  latlng = LatLng(
    (locations[i].lat),
    (locations[i].lng),
  );
  allMarkers.add(
    Marker(
      markerId: MarkerId(locations[i].accStatus.toString()),
      position: latlng,
    ),
  );
}
// setState(() {
//
// });

}

I have attached my model class and also the two functions through which i am fetching data from api. But the i am not able to place markers on map. Map just shows blank. Kindly help me out

0

There are 0 answers