Flutter Google maps not loading because of asynchronous suspension - flutter

Question

I am building an app in Flutter. I tried incorporating google maps into the app, but I can't see map on the emulator, as well as real device. I can see the google logo down on the screen and also zoom options can be seen. I have enabled maps sdk for android in google console. Also, I have added meta data required before activity tag.
My dart file displaying maps:
import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
class Home extends StatefulWidget {
const Home({super.key});
#override
State<Home> createState() => _HomeState();
}
class _HomeState extends State<Home> {
static const LatLng _kMapCenter =
LatLng(19.018255973653343, 72.84793849278007);
static const CameraPosition _kInitialPosition =
CameraPosition(target: _kMapCenter, zoom: 11.0, tilt: 0, bearing: 0);
late GoogleMapController _controller;
Future onMapCreated(GoogleMapController controller) async {
_controller = controller;
String value = await DefaultAssetBundle.of(context)
.loadString('assets/map_style.json');
_controller.setMapStyle(value);
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Google Maps Demo'),
),
body: GoogleMap(
initialCameraPosition: _kInitialPosition,
onMapCreated: onMapCreated,
),
);
}
}
My debug console:
Restarted application in 1,719ms.
E/Surface (14290): getSlotFromBufferLocked: unknown buffer: 0xe81e0710
I/AssistStructure(14290): Flattened final assist data: 376 bytes, containing 1 windows, 3 views
D/MapsInitializer(14290): preferredRenderer: null
D/zzcb (14290): preferredRenderer: null
I/Google Maps Android API(14290): Google Play services package version: 224617040
I/Google Maps Android API(14290): Google Play services maps renderer version(legacy): 203115000
I/PlatformViewsController(14290): Using hybrid composition for platform view: 0
E/GoogleMapController(14290): Cannot enable MyLocation layer as location permissions are not granted
E/EGL_emulation(14290): eglQueryContext 32c0 EGL_BAD_ATTRIBUTE
E/EGL_emulation(14290): tid 14290: eglQueryContext(2019): error 0x3004 (EGL_BAD_ATTRIBUTE)
D/HostConnection(14290): HostConnection::get() New Host Connection established 0xb73d0620, tid 14683
D/HostConnection(14290): HostComposition ext ANDROID_EMU_CHECKSUM_HELPER_v1 ANDROID_EMU_native_sync_v2 ANDROID_EMU_native_sync_v3 ANDROID_EMU_native_sync_v4 ANDROID_EMU_dma_v1 ANDROID_EMU_direct_mem ANDROID_EMU_host_composition_v1 ANDROID_EMU_host_composition_v2 ANDROID_EMU_YUV_Cache ANDROID_EMU_has_shared_slots_host_memory_allocator ANDROID_EMU_sync_buffer_data ANDROID_EMU_read_color_buffer_dma GL_OES_EGL_image_external_essl3 GL_OES_vertex_array_object GL_KHR_texture_compression_astc_ldr ANDROID_EMU_host_side_tracing ANDROID_EMU_gles_max_version_3_0
D/EGL_emulation(14290): eglCreateContext: 0xa9c85870: maj 1 min 0 rcv 1
2
D/EGL_emulation(14290): eglMakeCurrent: 0xa9c85870: ver 1 0 (tinfo 0xa8476730) (first time)
E/flutter (14290): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: Unable to load asset: assets/map_style.json
E/flutter (14290): #0 PlatformAssetBundle.load
package:flutter/…/services/asset_bundle.dart:258
E/flutter (14290): <asynchronous suspension>
E/flutter (14290): #1 AssetBundle.loadString
package:flutter/…/services/asset_bundle.dart:83
E/flutter (14290): <asynchronous suspension>
E/flutter (14290): #2 _HomeState.onMapCreated
package:d4u/…/withcar/home.dart:22
E/flutter (14290): <asynchronous suspension>
E/flutter (14290):
I/com.example.d4(14290): NativeAlloc concurrent copying GC freed 18209(1181KB) AllocSpace objects, 0(0B) LOS objects, 49% free, 4065KB/8131KB, paused 3.627ms total 110.580ms
F/crash_dump32(14756): crash_dump.cpp:474] failed to attach to thread 161: Permission denied
I/com.example.d4(14290): Thread[3,tid=14299,WaitingInMainSignalCatcherLoop,Thread*=0xda884610,peer=0x132c0228,"Signal Catcher"]: reacting to signal 3
I/com.example.d4(14290):
I/com.example.d4(14290): Wrote stack traces to tombstoned
2
E/libprocessgroup(14290): set_timerslack_ns write failed: Operation not permitted
F/crash_dump32(14917): crash_dump.cpp:474] failed to attach to thread 161: Permission denied
E/libprocessgroup(14290): set_timerslack_ns write failed: Operation not permitted
Screenshot of screen displaying maps
I had problem with google maps showing grey screen at first, and I found out that it was because of the emulator doesn't support google maps. But in other emulator also, I can't see maps. I have attached the image of my screen. I also tried in real android device, but it gives the same result.

Answer 1

I believe this post will help you : click here
Here I provided a sample code which actually works on both my emulator and device
class Map extends StatefulWidget {
const Map({Key? key}) : super(key: key);
#override
State<Map> createState() => _MapState();
}
class _MapState extends State<Map> {
static const _initialCameraPosition = CameraPosition(
target: LatLng(13.660397, 100.525939),
zoom: 4,
);
late GoogleMapController _googleMapController;
Marker? _origin;
#override
void dispose() {
_googleMapController.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
return Scaffold(
body: GoogleMap(
myLocationButtonEnabled: false,
initialCameraPosition: _initialCameraPosition,
onMapCreated: (controller) => _googleMapController = controller,
markers: {
if (_origin != null) _origin!,
},
onTap: _addMarker,
),
floatingActionButtonLocation: FloatingActionButtonLocation.startFloat,
floatingActionButton: FloatingActionButton(
onPressed: () => _googleMapController.animateCamera(
CameraUpdate.newCameraPosition(_initialCameraPosition),
),
foregroundColor: Colors.black,
backgroundColor: Theme.of(context).primaryColor,
child: const Icon(Icons.center_focus_strong),
),
);
}
}