Native google maps custom marker not working on android

Ionic Native
1

Hi all,

I have set a custom marker which works fine on IOS however android doesn’t seem to want to know it and instead loads the default.

      let markerOptions: MarkerOptions = {
        position: centre,
        title: 'You are here',
        icon: {
          url : 'assets/img/pin.png'
        }
      };

Not sure if it has something to do with the file path. I tried difference file paths, such as …/assets/img/pin.png but that just breaks the ios app and doesn’t fix the android.

Plus I tried to use,

        marker.setIcon({
          'url': 'assets/img/pin.png',
          'size': {
            width: 50,
            height: 50
          }
        });

Which made no difference.

2

@mkanmori did you ever got this issue solved? I’m currently facing the same issue with the latest version of the native plugin, but perhaps I’m doing something wrong. Works in the browser, but not on Android.

Any feedback would be appreciated.

1 Like
3

Facing same issue but the I am able to see .png image on Android and Browser but .svg is only working on browser not android.

4

@PUSH-NOTIFICATION-IO .svg markers are not supported by the plugin (today), check -> https://github.com/ionic-team/ionic-native-google-maps/issues/262#issuecomment-549861735

To fix the issue with missing custom markers, you should reinstall the plugin:

$> ionic cordova plugin rm cordova-plugin-googlemaps
$> ionic cordova plugin add https://github.com/mapsplugin/cordova-plugin-googlemaps#multiple_maps
5

As @Jagtlog said, .svg is not supported.
For png Files try to add ./ to the path so assets/some/file.png becomes ./assets/some/file.png.

Otherwise the native google Maps Plugin has currently an error, where you can’t use local Images for Marker Cluster Icons. Maybe this is important for you too. I created a PR to fix this, but it has not merged yet: https://github.com/mapsplugin/cordova-plugin-googlemaps/pull/2705

1 Like