Google Maps (cordova-plugin-googlemaps) will be changed

Hi Ionic users,

This is Masashi, who is the author of the cordova-plugin-googlemaps

The cordova googlemaps plugin will be bumped up version 2.0 soon.
The performance is improved overall, and multiple maps in one page, and also works in the multiple pages.

The reason of I wrote here is that some method names and some event names are changed from version 1.
I don’t know who managers the Google Map module for ionic,
but you need to update the wrapper code.

Unfortunately I’m not familiar with ionic. So I can not contribute.

The document is here.

And more detail document is in the demo apk.

Please update the Google Map module for ionic for the new version.

Thank you.

1 Like

Hey there! If you want, can you email me?

mike at ionic dot io

We can chat about the updates and go over some of the changes that need to happen.

Hey @wf9a5m75! Thanks for the heads up, sounds like a great improvement the community will love. We will work on getting that updated in ionic-native. Cheers

Thank you @mhartington, and @max

I changed the method names a little of the map class.
And event names are reorganized.

I wrote the migration document at here.

I also added some properties to Map (or other classes) for new features.
I will write the documents one by one.

And JS code is stored on separated files.

Some people has been trying to use the v2-beta version and ionic (without wrapper plugin).
It seems they does not have critical issue so far, so the plugin v2 should work on the ionic.

Please update the wrapper plugin.
The final release date is not set yet, but we are planing to release it in couple of weeks.
Thank you for your help.

Hi
I have a problem with that. I used command which you gave us:

$> cordova plugin add https://github.com/mapsplugin/cordova-plugin-googlemaps#multiple_maps --variable API_KEY_FOR_ANDROID="<YOUR KEY>" --variable API_KEY_FOR_IOS="<YOUR KEY>"

And I have this error:

Error: There was a conflict trying to modify attributes with <edit-config> in plugin cordova-plugin-googlemaps. 
The conflicting plugin, undefined, already modified the same attributes. 
The conflict must be resolved before cordova-plugin-googlemaps can be added. 
You may use --force to add the plugin and overwrite the conflicting attributes.

Then I used --force and build my app and…

A problem occurred configuring root project 'android'.
> Could not resolve all dependencies for configuration ':_debugCompile'.
> Could not find com.google.android.gms:play-services-maps:9.6.1.
         
Searched in the following locations:
     https://repo1.maven.org/maven2/com/google/android/gms/play-services-maps/9.6.1/play-services-maps-9.6.1.pom
     https://repo1.maven.org/maven2/com/google/android/gms/play-services-maps/9.6.1/play-services-maps-9.6.1.jar
     https://jcenter.bintray.com/com/google/android/gms/play-services-maps/9.6.1/play-services-maps-9.6.1.pom
     https://jcenter.bintray.com/com/google/android/gms/play-services-maps/9.6.1/play-services-maps-9.6.1.jar
     file:/media/cezary/9c1a0b57-d4f9-47fb-9779-386da6a843ff/android-sdk-linux/extras/android/m2repository/com/google/android/gms/play-services-maps/9.6.1/play-services-maps-9.6.1.pom
     file:/media/cezary/9c1a0b57-d4f9-47fb-9779-386da6a843ff/android-sdk-linux/extras/android/m2repository/com/google/android/gms/play-services-maps/9.6.1/play-services-maps-9.6.1.jar
     file:/media/cezary/9c1a0b57-d4f9-47fb-9779-386da6a843ff/android-sdk-linux/extras/google/m2repository/com/google/android/gms/play-services-maps/9.6.1/play-services-maps-9.6.1.pom
     file:/media/cezary/9c1a0b57-d4f9-47fb-9779-386da6a843ff/android-sdk-linux/extras/google/m2repository/com/google/android/gms/play-services-maps/9.6.1/play-services-maps-9.6.1.jar
  Required by:
    :android:unspecified

Any ideas with that? :confused:

install google play services from android sdk

1 Like

Thanks!

But now I see some errors with that statement:

this.map.on(GoogleMapsEvent.MAP_LONG_CLICK).subscribe((latLng) => {
  console.log("You clicked in:  " + latLng.toUrlValue());
});

Before update it works or

this.map.addMarker({
  position: new GoogleMapsLatLng(latitude, longitude),
  title: title
}, (marker) {
 //...     
});

causes error: Invalid number of arguments, expected 1.
Did you have similar problems?

The internal of the v2-beta version significantly changed from v1.
That’s why I asked to the ionic team to update the wrapper.

You can use the maps plugin WITHOUT wrapper on ionic,
but you can not use the maps plugin with wrapper so far.

Hi Max,

Wondering when the new one will be available for use?

We will be integrating the map into our application in the next sprint and I’m wondering whether I should use it as just the Cordova plugin or wait for the Ionic Native wrappers.

The native wrappers tend to behave predictably so thats my preference but I’m unsure of the complexity from your end in terms of getting the changes out?

Hello,

I tried updating to the new version but I get this error when running “ionic run android”:

/home/ben/foo/app/platforms/android/src/plugin/google/maps/PluginMap.java:76: error: package cordova.google.maps does not exist

import cordova.google.maps.R;
                          ^

/home/ben/foo/app/platforms/android/src/plugin/google/maps/PluginMap.java:875: error: package R does not exist
          View dummyView = cordova.getActivity().getLayoutInflater().inflate(R.layout.dummy_infowindow, null);
                                                                              ^

Note: Some input files use or override a deprecated API.

Note: Recompile with -Xlint:deprecation for details.

Note: Some input files use unchecked or unsafe operations.

Note: Recompile with -Xlint:unchecked for details.

2 errors

I already reinstalled the plugin as well as the android platform, but this did not help.
Do you have any idea what causes this? I tried to compile the example cordova project and this worked without problems.

Oh, I see. Sorry.

I implemented the InfoWindow class recently.
It seems the Cordova does not copy the dummy_infowindow.xml file into your project.

Please make a directory at platforms/android/res/layout,
and download the dummy_infowindow.xml from here then store into the directory.

thank you for your answer, however this does not work:

[ben@ben app] $ cat platforms/android/res/layout/dummy_infowindow.xml 
<?xml version='1.0' encoding='utf-8'?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content">

  <View
    android:visibility="invisible"
    android:layout_width="1dp"
    android:layout_height="1dp" />

</LinearLayout>

If I start it I get the same eror:

[ben@ben app] $ ionic run android



[...]


Running command: /home/ben/blindmate/app/hooks/after_prepare/010_add_platform_class.js /home/ben/blindmate/app


add to body class: platform-android

ANDROID_HOME=/home/ben/AndroidSDK

JAVA_HOME=/usr/lib/jvm/java-1.8.0-openjdk-1.8.0.111-1.b16.fc24.x86_64

Subproject Path: CordovaLib

Incremental java compilation is an incubating feature.

:preBuild
 UP-TO-DATE

:preDebugBuild 
UP-TO-DATE
:checkDebugManifest


:CordovaLib:preBuild UP-TO-DATE
:CordovaLib:preDebugBuild UP-TO-DATE
:CordovaLib:checkDebugManifest


:CordovaLib:prepareDebugDependencies

:CordovaLib:compileDebugAidl
 UP-TO-DATE
:CordovaLib:compileDebugNdk UP-TO-DATE

:CordovaLib:compileLint UP-TO-DATE

:CordovaLib:copyDebugLint
 UP-TO-DATE
:CordovaLib:mergeDebugShaders
 UP-TO-DATE
:CordovaLib:compileDebugShaders UP-TO-DATE
:CordovaLib:generateDebugAssets UP-TO-DATE
:CordovaLib:mergeDebugAssets
 
UP-TO-DATE
:CordovaLib:mergeDebugProguardFiles UP-TO-DATE
:CordovaLib:packageDebugRenderscript UP-TO-DATE
:CordovaLib:compileDebugRenderscript
 
UP-TO-DATE

:CordovaLib:generateDebugResValues
 UP-TO-DATE

:CordovaLib:generateDebugResources UP-TO-DATE

:CordovaLib:packageDebugResources
 UP-TO-DATE

:CordovaLib:processDebugManifest
 
UP-TO-DATE

:CordovaLib:generateDebugBuildConfig
 
UP-TO-DATE


:CordovaLib:processDebugResources
 UP-TO-DATE
:CordovaLib:generateDebugSources UP-TO-DATE
:CordovaLib:incrementalDebugJavaCompilationSafeguard
 UP-TO-DATE

:CordovaLib:compileDebugJavaWithJavac
 UP-TO-DATE

:CordovaLib:processDebugJavaRes
 UP-TO-DATE

:CordovaLib:transformResourcesWithMergeJavaResForDebug
 UP-TO-DATE
:CordovaLib:transformClassesAndResourcesWithSyncLibJarsForDebug
 UP-TO-DATE

:CordovaLib:mergeDebugJniLibFolders
 UP-TO-DATE


:CordovaLib:transformNative_libsWithMergeJniLibsForDebug
 UP-TO-DATE

:CordovaLib:transformNative_libsWithSyncJniLibsForDebug
 UP-TO-DATE

:CordovaLib:bundleDebug
 UP-TO-DATE
:prepareAndroidCordovaLibUnspecifiedDebugLibrary
 UP-TO-DATE

:preReleaseBuild
 
UP-TO-DATE

:CordovaLib:preReleaseBuild UP-TO-DATE

:CordovaLib:checkReleaseManifest


:CordovaLib:prepareReleaseDependencies


:CordovaLib:compileReleaseAidl
 
UP-TO-DATE


:CordovaLib:compileReleaseNdk
 
UP-TO-DATE


:CordovaLib:copyReleaseLint
 
UP-TO-DATE


:CordovaLib:mergeReleaseShaders
 
UP-TO-DATE


:CordovaLib:compileReleaseShaders
 
UP-TO-DATE

:CordovaLib:generateReleaseAssets UP-TO-DATE

:CordovaLib:mergeReleaseAssets
 
UP-TO-DATE


:CordovaLib:mergeReleaseProguardFiles
 
UP-TO-DATE


:CordovaLib:packageReleaseRenderscript
 
UP-TO-DATE
:CordovaLib:compileReleaseRenderscript
 
UP-TO-DATE

:CordovaLib:generateReleaseResValues UP-TO-DATE
:CordovaLib:generateReleaseResources UP-TO-DATE
:CordovaLib:packageReleaseResources
 UP-TO-DATE
:CordovaLib:processReleaseManifest UP-TO-DATE
:CordovaLib:generateReleaseBuildConfig
 UP-TO-DATE
:CordovaLib:processReleaseResources
 UP-TO-DATE

:CordovaLib:generateReleaseSources
 UP-TO-DATE

:CordovaLib:incrementalReleaseJavaCompilationSafeguard
 UP-TO-DATE

:CordovaLib:compileReleaseJavaWithJavac
 UP-TO-DATE
:CordovaLib:processReleaseJavaRes UP-TO-DATE
:CordovaLib:transformResourcesWithMergeJavaResForRelease UP-TO-DATE

:CordovaLib:transformClassesAndResourcesWithSyncLibJarsForRelease
 UP-TO-DATE

:CordovaLib:mergeReleaseJniLibFolders UP-TO-DATE
:CordovaLib:transformNative_libsWithMergeJniLibsForRelease UP-TO-DATE

:CordovaLib:transformNative_libsWithSyncJniLibsForRelease UP-TO-DATE
:CordovaLib:bundleRelease UP-TO-DATE
:prepareComAndroidSupportCardviewV72340Library UP-TO-DATE
:prepareComAndroidSupportCustomtabs2340Library UP-TO-DATE
:prepareComAndroidSupportSupportV132340Library
 UP-TO-DATE

:prepareComAndroidSupportSupportV42400Library
 UP-TO-DATE


:prepareComFacebookAndroidFacebookAndroidSdk4141Library
 UP-TO-DATE

:prepareComGoogleAndroidGmsPlayServicesBase961Library
 UP-TO-DATE
:prepareComGoogleAndroidGmsPlayServicesBasement961Library
 UP-TO-DATE
:prepareComGoogleAndroidGmsPlayServicesGcm902Library UP-TO-DATE
:prepareComGoogleAndroidGmsPlayServicesIid902Library
 UP-TO-DATE
:prepareComGoogleAndroidGmsPlayServicesLocation961Library
 
UP-TO-DATE
:prepareComGoogleAndroidGmsPlayServicesMaps961Library UP-TO-DATE
:prepareComGoogleAndroidGmsPlayServicesTasks961Library UP-TO-DATE
:prepareMeLeolinShortcutBadger114Library UP-TO-DATE
:prepareDebugDependencies

:compileDebugAidl
 UP-TO-DATE
:compileDebugRenderscript
 UP-TO-DATE
:generateDebugBuildConfig
 UP-TO-DATE
:generateDebugResValues
 UP-TO-DATE
:generateDebugResources
 UP-TO-DATE
:mergeDebugResources

:processDebugManifest
 UP-TO-DATE

:processDebugResources


:generateDebugSources
:incrementalDebugJavaCompilationSafeguard
 UP-TO-DATE

:compileDebugJavaWithJavac

:compileDebugJavaWithJavac - is not incremental (e.g. outputs have changed, no previous execution, etc.).

/home/ben/blindmate/app/platforms/android/src/plugin/google/maps/PluginMap.java:76: error: package cordova.google.maps does not exist
import cordova.google.maps.R;
                          ^

/home/ben/blindmate/app/platforms/android/src/plugin/google/maps/PluginMap.java:875: error: package R does not exist
          View dummyView = cordova.getActivity().getLayoutInflater().inflate(R.layout.dummy_infowindow, null);
                                                                              ^

Note: Some input files use or override a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
Note: Some input files use unchecked or unsafe operations.
Note: Recompile with -Xlint:unchecked for details.
2 errors

:compileDebugJavaWithJavac FAILED


FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':compileDebugJavaWithJavac'.
> Compilation failed; see the compiler error output for details.

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.


BUILD FAILED

Total time: 3.852 secs

Error: /home/ben/blindmate/app/platforms/android/gradlew: Command failed with exit code 1 Error output:
/home/ben/blindmate/app/platforms/android/src/plugin/google/maps/PluginMap.java:76: error: package cordova.google.maps does not exist
import cordova.google.maps.R;
                          ^
/home/ben/blindmate/app/platforms/android/src/plugin/google/maps/PluginMap.java:875: error: package R does not exist
          View dummyView = cordova.getActivity().getLayoutInflater().inflate(R.layout.dummy_infowindow, null);
                                                                              ^
Note: Some input files use or override a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
Note: Some input files use unchecked or unsafe operations.
Note: Recompile with -Xlint:unchecked for details.
2 errors

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':compileDebugJavaWithJavac'.
> Compilation failed; see the compiler error output for details.

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.

Still the same error :frowning:

I updated the branch code. Please reinstall the plugin.

thank you, this works!

@mhartington, and @max is the update to v2 still on the cards? do you have an ETA? Thanks!!

Nothing yet, we’ve had some issues building the v2 plugin. @jgw9617 can add more info on what he’s seeing.

@max What’s the difficult point for you?

@jgw9617 can you share the build issues you had with the v2 plugin?

This plugin rocks! NIce work @wf9a5m75. Using .setClickable() is a pain though, since I am new to Ionic2 final. I have ion-fab buttons and other elements over the map and the clicks passing to the map require some attention. I don’t know what to do to make those elements aware of clicks over them. The rest is working perfectly, better impossible. I’ll keep googling, but would appreciate any hint.


Edit:
Putting the FAB inside map’s div make it work.

The cordova-plugin-googlemaps v2.0-beta2

Hi all, it’s been a while.

After releasing the v2.0-beta, I have tackled with lots of bugs and fixed them.
I know there might be some another bugs, bug getting be very stable.

And lots of new features are available.
Please check out the documentation.

How to use the plugin v2 with the ionic?

Actually I’m not familiar with ionic (don’t ask to me), but little document is available.

For the ionic team, please prepare to create the ionic wrapper for the v2.
If you have any issues, please post to the plugin’s issue list. Thanks.

1 Like