Google maps in capacitor

[TechNerdsUzi]

How I integrate Google maps in capacitor framework

[jcesarmobile]

You can use the JS SDK as explained in this blog post
https://www.joshmorony.com/using-google-maps-and-geolocation-in-ionic-with-capacitor/

If you want native SDKs, there is no Capacitor Google maps plugin yet

[kevinrodriguez-io]

I really hate Josh Morony posts, he always says that using the 'Web SDK' is the best option, but in this specific scenario, native google maps provides a lot of features that are cheaper (less requests to google maps, because of OFFLINE map caching) the ability to work offline, map animations and a lot of features missing in the web sdk.

Same story with Augmented Reality, Cordova | Capacitor for AR would be better than any web framework but no, he pushes web technology.

[jcesarmobile]

I've added the plugin request label, so add thumbs up reaction to the issue and we will consider the ones with more positive reactions

[bsor-dev]

Does @ionic-native googlemaps compatible with capacitor? I tried, it works on browser but when I run in android device it shows error adding cordova plugin for googlemaps

[jcesarmobile]

ionic-native are just wrappers for cordova plugins, in this case, the ionic-native/googlemaps is a wrapper for cordova-plugin-googlemaps, you have to install cordova-plugin-googlemaps to make the wrapper work.
I've tested it in Android and it works, but it's incompatible on iOS.

[Mapiac]

Is cordova-plugin-googlemaps compat yet with iOS Capacitor @jcesarmobile or anyone know?

[madmacc]

Not for iOS.

[tototares]

Is it possible to use 'cordova-plugin-googlemaps' without the ionic-native wrapper? Because I just use Capacitor without ionic and I don't want to use the JS SDK as well.

[tepafril]

@dupiesdupreez the solution is not for native sdk. It uses JS SDK which is not free and not available for offline mode.

[dupiesdupreez]

@tepafril Yea I know, but Its Ionic, when do you Not have to hack 99% of what you do

[tepafril]

For now, the only way to use Native SDK is to downgrade to ionic cordova.

[muuvmuuv]

Wouldn't it even greater to have a capacitor maps plugins that

1. uses Apple Maps on iOS
2. Google Maps on Android
3. Above JS SDK for browser/PWA

So the base OS native maps features are used with a single API. ATM the only option I see is using some sort of JS SDK (I'm using HERE Maps atm) but native would be superb! So I would rename the issue and it should be opened again!

[madmacc]

@muuvmuuv People use Apple Maps?

[mchl18]

@dupiesdupreez By pointing us to the JS implementation you are ignoring the core of this thread (@kevinrodriguez-io post is where I am leaning), which is specifically to use the features that the native SDK provides. If it was a true alternative this threat could have been closed.

This is an essential Plugin and since it's either all-Capacitor or all-Cordova, the choice will be cordova for a looooot of apps.

Consider the pricing alone, while using the native SDK is free, using the JS SDK will cost 7$/1000 clicks.

Too sad, I would have loved to use capacitor here but that is a deal-breaker.

[skulegirl]

+1 on lack of native SDK Google maps being a deal breaker for using Capacitor. Please find some resources to put into that so we can all use the latest & greatest.

[chetanmore0510]

google-maps seems to be widely used plugin and capacitor lacks it. now we can't downgrade to cordova, because it still has UIWebview references and Apple does not allow UIWebview references since May, 1st 2020. any help from the team would be appreciated. mean while we will use JS SDK, but it will cost us around 7$/1000 clicks.

[SimonBrazell]

Hmm was going to try use Capacitor for a new project I'm working on but I guess without native maps support I'm stuck with Cordova... which isn't a terrible thing as I'm familiar with it anyway.

@chetanmore0510 Cordova is still viable even with the UIWebView API deprecation, just follow the steps outlined in this Ionic Blog post to use WKWebView with cordova instead, I've not had any issues with any of the plugins I use since doing this.

[chetanmore0510]

@SimonBrazell thanks for the reply. can you help me to identify that which cordova plugin is still using UIWebview, so that i can remove it and try some other solution. i have below plugins installed in my project.

"cordova-admob-sdk": "^0.24.1",
"cordova-android": "^8.1.0",
"cordova-browser": "^6.0.0",
"cordova-ios": "^5.1.1",
"cordova-plugin-add-swift-support": "^2.0.2",
"cordova-plugin-admob-free": "^0.27.0",
"cordova-plugin-android-permissions": "^1.0.2",
"cordova-plugin-app-version": "^0.1.9",
"cordova-plugin-apprate": "^1.5.0",
"cordova-plugin-camera": "^4.1.0",
"cordova-plugin-datepicker": "^0.9.3",
"cordova-plugin-device": "^2.0.3",
"cordova-plugin-dialogs": "^2.0.2",
"cordova-plugin-geolocation": "^4.0.2",
"cordova-plugin-googlemaps": "^2.6.2",
"cordova-plugin-market": "^1.2.0",
"cordova-plugin-nativestorage": "^2.3.2",
"cordova-plugin-request-location-accuracy": "^2.3.0",
"cordova-plugin-sim": "^1.3.3",
"cordova-plugin-telerik-imagepicker": "^2.3.3",
"cordova-promise-polyfill": "0.0.2",
"cordova-support-google-services": "^1.3.2",
"cordova.plugins.diagnostic": "^5.0.1",
"phonegap-plugin-barcodescanner": "^8.1.0",
"phonegap-plugin-multidex": "^1.0.0",
"phonegap-plugin-push": "^2.3.0"

[SimonBrazell]

My project has the following plugins included:

    "cordova-android": "8.1.0",
    "cordova-browser": "6.0.0",
    "cordova-ios": "5.1.1",
    "cordova-plugin-androidx": "^1.0.2",
    "cordova-plugin-androidx-adapter": "^1.1.0",
    "cordova-plugin-badge": "^0.8.8",
    "cordova-plugin-camera-with-exif": "^1.3.1",
    "cordova-plugin-compat": "^1.2.0",
    "cordova-plugin-file": "^6.0.2",
    "cordova-plugin-firebase-analytics": "^4.3.0",
    "cordova-plugin-geolocation": "^4.0.2",
    "cordova-plugin-googlemaps": "^2.6.2",
    "cordova-plugin-inappbrowser": "^3.2.0",
    "cordova-plugin-local-notification": "git+https://github.com/Steffaan/cordova-plugin-local-notifications.git",
    "cordova-sqlite-storage": "^5.0.0",
    "cordova-support-android-plugin": "^1.0.2",
    "cordova-support-google-services": "^1.4.0",
    "onesignal-cordova-plugin": "^2.9.0"

So I'd look at those that aren't included for the culprit, might be a slow process but at least you can rule these ones out, oh and I've used phonegap-plugin-barcodescanner and the plain cordova-plugin-camera on other recent projects with no issues so cross that one off too 🙂

The first one I'd look at is cordova-plugin-admob-free, wouldn't be surprised if that uses it. Also would be a good opportunity to cull those that aren't necessary...

[dotNetkow]

Hi everyone, some things to consider:

(I'm biased but) Capacitor's overall dev experience is much better than Cordova and it's mostly backward compatible with Cordova. So Google Maps issues aside, you really should give Capacitor a try. We have tons of details in the docs about migration and getting started.

Google Maps JS SDK costs money, iOS/Android SDKs don't.
I'm not sure why that is, but that's correct. That's Google's decision though, not Ionic's. It's a complex product that costs money to maintain, so that's probably why they charge.

But Matt, I really need this. Some options:

• Capacitor has really great custom plugin support. I know most of us aren't native devs, but it technically is possible to create a custom Capacitor plugin that wraps the native google maps ios/android sdks.
• Give a thumbs up on this issue at the top. Please don't keep commenting, that just adds noise.
• If you're part of a company and it's truly crucial functionality, reach out to us. Remember, your time as a developer is extremely valuable - Rather than spending hours and hours struggling and getting nowhere, talk to your leads/managers about Ionic's supported/maintained native plugin options. Also, we're always listening and interested in hearing about common pain points. It helps us decide what to build next. So even if something isn't available today, it could be.

Cheers!

[NePheus]

mapsplugin/cordova-plugin-googlemaps#2781 Here we go. Fundraising for capacitor support of the existing cordova google maps plugin.

[Ionitron]

👋

We now have a repo for Capacitor Community proposals.

This request has been moved to capacitor-community/proposals#20. Please 👍 the issue if you'd like to see this plugin for Capacitor!

Thanks!
Ionitron 💙