Google maps doesn't show HTML objects on ios its rendered on top of webview

Capacitor
1

### Plugin(s)

@Capacitor/googlemaps

### Capacitor Version

  > @capacitor/cli: 4.6.1
>   @capacitor/android: 4.6.1
>   @capacitor/core: 4.6.1
>   @capacitor/ios: 4.6.1

### Platform(s)

IOS

### Problem

I recently upgraded to capacitor 4 & used @Capacitor/googlemaps instead of capacitor-community/google-maps
It works fine on android devices but i got an issue running it on IOS devices
it takes all the screen and hide all HTML elements on the page seems like its come over the webview itself.
as shown on the image:

image
image1235×1080 98.8 KB

as you can see both header & footer are gone away i searched a lot about that issue but i didn’t get any workaround or solution.

also if it will help i got on xcode debug that error direct after map creation :

2022-12-08 23:36:03.319063+0300 App[3647:1011396] [core] “Error returned from daemon: Error Domain=com.apple.accounts Code=7 “(null)””

after a while i confirmed that the map rendered on top of the webview.

If you can help with that thank you.

2

You can use css to fix the issue. Soemthing like:

.section {
  z-index: 9999;
  position: fixed;
  top: 16px;
  left: 16px;
}
3

Thanks for your response but it’s not working,
The main problem is that the native map screen comes in front of the web view layout screen.
I created a repo for the issue can be found here :

i just made a blank new project with simple page and init the map
i’m testing on ios 16.1.1 & ios 16.1.2