ThinkGeo.com    |     Documentation    |     Premium Support

ThinkGeo MAUI Issue With Loading Google Map

Hi,

We are using google map layer in our MAUI application and are facing issues with loading google maps on android devices with android version 13 and 14 using single tile. we are using ThinkGeo.Core.Async.GoogleMapsLayer and it is working fine on device with android version 11 but if I use same build with android version 14 map just shows white screen and does not load any images. On further analysis I found that on android version 13 and 14 multi-tile is loading map fine but map is not loading when I change it to single tile.

Also what is minimum RAM requirement for android device to use thinkgeo when using on older devices with 2 GB RAM I face random crashes while performing map operations.

Attaching error that I see in debug console when it tries to load map.
error.txt (15.9 KB)

Hi,

Thanks for evaluating MAUI edition!

We couldn’t recreate the issue using MAUI v14.0.2, the following code works fine on both emulator Pixel 5 Android 14.0 and Android 13.0

   MapView.MapUnit = GeographyUnit.Meter;
    
   // Set the map extent
   MapView.CenterPoint = new RectangleShape(-10786436, 3918518, -10769429, 3906002).GetCenterPoint();
   MapView.MapScale = 34000;

   var layerOverlay = new LayerOverlay();

   var googleLayer = new GoogleMapsLayer("GoogleApiKey");
   layerOverlay.Layers.Add(googleLayer);
   MapView.Overlays.Add(layerOverlay);

   await MapView.RefreshAsync();

Please use the latest version v14.0.2 NuGet Gallery | ThinkGeo.UI.Maui 14.0.2 and have another try. If the issue still exists, let us know the model of the android device you were using and we can have a close test.

The error.txt you provided shows the glide exception. So you are using glide in your maui project to load the images, right? So how does it work with ThinkGeo MAUI component, can you share the code with us?

ThinkGeo MAUI component doesn’t have a RAM requirement itself, of course everything depends on how many features, how big the images are rendered, etc. You have total control over the memory which means you can, for example avoid rendering a layer with complicated features when the current device has less than 2G RAM, or something.

Thanks,
Ben

Hi Ben,

Thanks for your response. I tried code snippet that you sent and its loading map fine. Issue arises when I try to set GoogleMapsMapType to hybrid.

mapView.MapUnit = GeographyUnit.Meter;

// Set the map extent
mapView.CenterPoint = new RectangleShape(-10786436, 3918518, -10769429, 3906002).GetCenterPoint();
mapView.MapScale = 34000;
mapView.MapTools.Add(new ZoomMapTool());

var layerOverlay = new LayerOverlay();

var googleLayer = new GoogleMapsLayer(“GoogleApiKey”);
googleLayer.MapType = GoogleMapsMapType.Hybrid;

layerOverlay.Layers.Add(googleLayer);
mapView.Overlays.Add(layerOverlay);
await mapView.RefreshAsync();

Attaching project sample for your reference and screenshot of android emulator with android version 13.I am also not using glide library to load images its just empty project with thinkgeo library and error messages are thrown while using in hybrid maptype.

MapTest.zip (383.5 KB)

Thanks for sharing the code!

And I figured it is because you were calling an async method in a sync method. Here is your code:

    private void mapView_SizeChanged(object sender, EventArgs e)
    {
        loadMap();
    }

    private async void loadMap()
    {
        ......
        await mapView.RefreshAsync();
    }

and it should be:

    private async void mapView_SizeChanged(object sender, EventArgs e)
    {
        await loadMap();
    }

    private async Task loadMap()
    {
        ......
        await mapView.RefreshAsync();
    }

you see every async method needs to be await all the way up, and try not use async void unless that’s for an event.

After some renaming / perf improvement, it can be something like following:

   private bool _initialized;
   private async void mapView_SizeChanged(object sender, EventArgs e)
   {
       if (_initialized)
           return;
       _initialized = true;
       await loadMapAsync();
   }

   private async Task loadMap()
    {
        ......
        await mapView.RefreshAsync();
    }

Thanks,
Ben

Hi Ben,

After adding async and await and restructuring code I am still not able to load map in hybrid maptype and single tile. On analyzing I found, map is loading fine on mobile device emulators but is not loading when I use tablet device emulators. seems like on mobile devices as screen size is small the image size is small and its loading it fine but on devices with large screen it tries to load large image and it fails. attaching both screenshots of mobile vs tablet.

Hi,

Can you let me know the configuration of your android emulator, I can so make sure to launch the exact same environment?

By the way here is what it looks like running on iPad Pro with iOS 17.4. My Google License returns up to 640*640 image and that’s why it’s not fullfilling the entire screen.

Thanks,
Ben

Hi Ben,

We are using Windows machine and this issue is not happening on Macbook and on iPad’s. It is just happening on Android tablets that to specifically on Android version 13 and 14 while running on windows platform. I even tried it on different windows machine thinking it might be issue with my machine, but map is still not loading. Please follow below steps to reproduce this issue.

  1. Build Solution on Windows machine I am using windows 10
  2. Create emulator with tablet configuration adding screenshot of my emulator configuration
  3. Configure Google map to load in Hybrid maptype and SingleTile
  4. Run application on Android tablet emulator.

Some more finding:

  1. On MacBook even android tablet emulator is loading map images while running in debug mode, but if I generate APK from MacBook in release configuration and try to run on real Android tablet device its not loading map.
  2. On Windows while running application on debug itself wont load map and you can see errors getting displayed in your debug console while running on tablet emulator.

Screenshot of error message in debug console while running on windows machine and Android tablet emulator with Android version 13. This error is thrown each time I zoom in or zoom out of map.

Here I created a test project and it works fine on my side:

  1. I’m using VS 2022 (17.9.7) on Windows 12, the emulator is Nexus 9 - Android 13.0
  2. I’m using the latest nuget packages, as following
  3. Everything just worked as expected, no errors.
  4. There is no “Failed to load resource” or any “Exception” shows up in the Output window

Here is the test project, please have a try and let us know if there’s any issues running on your side. TestGoogleOnMaui.zip (223.5 KB)

Thanks,
Ben

Hi Ben,

After trying your solution I was still not able to load map but I figured out the root cause. When I try Free tier Google API Key I am able to load map as Images return by API is 1280 x 1286. But the Google API key that we are using is Paid key and provides higher resolution images 1930 x 1236 in this scenario we are facing issue. As we are targeting our application on tablets we require higher size images so that there are less white bars shown on side when map loads. Please try this on Windows machine Attaching both screenshot below.


Hi,

  1. The “Free Key” is requesting High Res images (Scale = 2) from Google Map Server when running on an iPad. It returns up to 640x640 (Scale = 2) image, which is 1280px by 1280 px. Check out the google doc for the detail;
    https://developers.google.com/maps/documentation/maps-static/start

  2. The premium key should return the image with the same Scale but larger resolutions. For example if we request a 800 x 800 (scale 2 ) image, a regular Google Key returns a 1280 x 1280 image while the premium key returns 1600 x 1600 image.

As a result if the free key works, the premium key should for sure works as well. I think your Paid Key might have some issues. Can you test it by sending a single request to google server using that key see if the image is successfully returned?

Thanks,
Ben

Hi,

Thanks for the meeting just now. As I don’t have a premium key to test, can you do the following for me:

  1. Add the following 2 lines to your code
    ThinkGeoDebugger.LogType = ThinkGeoLogType.WebRequest;
    ThinkGeoDebugger.LogLevel = ThinkGeoLogLevel.All;
    And you will see something like following in the Visual Studio output window:

  2. That’s the link sent to Google Map Server to fetch the image. Open the link in a browser on the same Android emulator see if the image loads correctly.

  3. If #2 works fine, please send over the returned image to us. (You can just open the link on Windows and save/send us the image)

Thanks,
Ben

Hi Ben,

Verified the API calls think geo is sending to google server and its loading image fine in browser with premium key attaching images received from API as zip file. I have added both free version of image as well as paid version.

GoogleMapImages.zip (1.4 MB)

Hi Thenish,

I reviewed the source code and made some changes. Please

  1. Upgrade to the latest beta (ThinkGeo.UI.Maui 14.1.0-beta033 ) and have another try.

  2. If it still doesn’t work, enable the ThinkGeoDebugger like following:

     ThinkGeoDebugger.LogLevel = ThinkGeoLogLevel.All;
     ThinkGeoDebugger.LogType = ThinkGeoLogType.WebRequest;
    

Run it and search “Fetched Image from Google Maps Server” in your output window and send over that line to me, it would be something like this:

[0:] ThinkGeo Message - 11:44:16.3824099: Fetched Image from Google Maps Server: Width:1280 Height:1112; location: …

Also, if you see any error message starting with "ThinkGeo Message - ", please send it over to me as well.

Thanks,
Ben

Hi Ben,

I tried ThinkGeo.UI.Maui 14.1.0-beta033 version and I am still not able to load google map images. In output window I am getting below thinkgeo message.

ThinkGeo Message - 10:42:15.2998656: Fetched Image from Google Maps Server: Width:1930 Height:1176; location: (-10777932.5, 3912260); stretched: (2049, 1249); requestedImageScale: 72224.00276816485, currentScale: 34000.00000000272

and then glide exception is thrown.
[Glide] Load failed for [mono.android.runtime.InputStreamAdapter@fc706b8] with dimensions [2048x1247]

Attaching full log of debug window below
ThinkGeo_ErrorLog.txt (17.5 KB)

Hi Thenish,

Please do the couple things for me:

  1. Switch to (mapType.RoadMap, PremiumKey), with which the map shows correctly on your side, and send me the same " Fetched Image from Google Maps Server:" string from the output window.

  2. Switch to (mapType.Hybrid, RegularKey), and send me the same string from output.

  3. Let me know if you see any exceptions in the output for the above 2 cases.

Thanks,
Ben

Hi Ben,

1. Switching to mapType.RoadMap and using Premium Key

ThinkGeo Message - 11:14:03.9410689: Fetched Image from Google Maps Server: Width:2048 Height:1248; location: (-10777932.5, 3912260); stretched: (2048, 1248); requestedImageScale: 144448.0055363297, currentScale: 72224.00000000148

Image gets loaded correctly with map type as RoadMap. No exceptions are thrown in debug window.

2. Switching to mapType.Hybrid and using Free Key
ThinkGeo Message - 11:17:25.2272981: Fetched Image from Google Maps Server: Width:1280 Height:1248; location: (-10777932.5, 3912260); stretched: (1280, 1248); requestedImageScale: 144448.0055363297, currentScale: 72224.00000000148

Image gets loaded correctly with map type as Hybrid. No exceptions are thrown in debug window.

Hi Thenish,

Thanks for the info! I got some answers but in fact now have more questions. For example the Hybrid map returned is (1930 * 1176), but the returned roadmap is (2048*1248). I was expecting they have identical settings with the only exception of MapType, are they? or the google server just returns different resolution for different map type even the request size are the same?

Anyway, I think the best way to tackle it is to have a key and run the demo on our side. I will talk to the right person in my company who will try to contact google see if they can give us a test account. Of course if you guys can create a temp key for us or something, that’ll be awesome!

Thanks,
Ben

Hi Ben,

Just checking if you got any updates related to google map issue with premium key.

Thenish, we created a support case and still waiting for Google’s reply.

Hi Ben,

After adding latest beta version of SkiaSharp.Extended.UI.Maui version 3.0.0-preview.7. I am constantly able to reproduce map load issue even with free key please give it a try and check if you able to reproduce it attaching the sample for your reference.

  1. I am using ThinkGeo.UI.Maui Version=14.2.0-beta004
  2. Using Android tablet emulator Nexus 9 or Nexus 10 with android version 13 or android version 14 on windows machine.

TestGoogleOnMaui.zip (793.5 KB)