Ionic 4: custom markers crash native builds

[services4smb]

I'm submitting a ... (check one with "x")

• [ ] question
• [x ] any problem or bug report
• [ ] feature request

If you choose 'problem or bug report', please select OS: (check one with "x")

• [ x] Android
• [ ] iOS
• [ ] Browser

cordova information: (run $> cordova plugin list)

cordova-plugin-device 2.0.2 "Device"
cordova-plugin-googlemaps 2.6.2 "cordova-plugin-googlemaps"
cordova-plugin-ionic-keyboard 2.1.3 "cordova-plugin-ionic-keyboard"
cordova-plugin-ionic-webview 4.0.1 "cordova-plugin-ionic-webview"
cordova-plugin-splashscreen 5.0.2 "Splashscreen"
cordova-plugin-statusbar 2.4.2 "StatusBar"
cordova-plugin-whitelist 1.3.3 "Whitelist"

If you use @ionic-native/google-maps, please tell the package.json (only @ionic-native/core and @ionic-native/google-maps are fine mostly)

"@ionic-native/core": "^5.5.1",
"@ionic-native/google-maps": "^5.5.0",

Current behavior:

I have build a Google Maps Demo app, but are struggling with Google Maps using custom markers, which seems to crash the app. Using the same markers in browser works fine.

$ionic cordova run browser -l

I have tried to use different refs to the marker, but result is a crash every time.

this.markerB = this.map.addMarkerSync({
    title: 'Marker B',
    position: position,
    animation: GoogleMapsAnimation.BOUNCE,
    draggable: true,
    // works in browser and native build: 
    // icon: 'green'
    icon: {
        // works in browser but not in native build:
        url: 'assets/image/map_marker_crosshair.svg',

        // works in browser but not in native build:
       // url: 'http://icons.iconarchive.com/icons/iconarchive/red-orb-alphabet/24/Number-1-icon.png',

        anchor: [16, 16],      
        size: {
            width: 32,
            height: 32
        }
    }
});

I'm running the app on the device using the following command: $ ionic cordova run android

Steps to reproduce the crash: 1). Click on button 'open map (a-b) page'. Blue marker (A) are shown. 2). Click somewhere on the map to set marker (B) and have the distance calculated = crash

Additional info: Map is 100% of screen, o.k. My location is shown and location button works, o.k. Zoom in/out works, o.k. Long click to move marker works, o.k. Custom map button to set range circles works. o.k.

Expected behavior:

I don't expect the native build to crash the app :-)

Screen capture or video record:

Related code, data or error log (please format your code or data):

https://bitbucket.org/nicedevice/googlemaps/

[wf9a5m75]

SVG is not supported.

[services4smb]

@wf9a5m75 but PNG is supported right? I have also tried changing the URL to 'http://icons.iconarchive.com/icons/iconarchive/red-orb-alphabet/24/Number-1-icon.png' with same result = crash.

It's a great plugin, but I really need the custom marker feature. Any help would be much appreciated.

[wf9a5m75]

I see. Could you show me the logcat crash log?

[services4smb]

I'm not an expert in debugging android apps, but I assume the following is ok? Please correct me if I'm wrong. $ adb logcat | grep -i "dk.jagtlog.googlemaps"

Output would be like this (app dies at 11-05 21:53:26.942):

11-05 21:53:03.317  2426  2767 I AppOps  : sendInfoToFLP, code=41 , uid=10223 , packageName=dk.jagtlog.googlemaps , type=startOp
11-05 21:53:03.317  2426  6865 I AppOps  : sendInfoToFLP, code=42 , uid=10223 , packageName=dk.jagtlog.googlemaps , type=startOp
11-05 21:53:23.357 15057 15202 E AndroidRuntime: Process: dk.jagtlog.googlemaps, PID: 15057
11-05 21:53:23.367  2426  4399 W ActivityManager:   Force finishing activity dk.jagtlog.googlemaps/.MainActivity
11-05 21:53:23.547  2426  2549 D StatusBarManagerService: manageDisableList userId=0 what=0x0 pkg=Window{7cde710 u0 d0 p2426 Application Error: dk.jagtlog.googlemaps}
11-05 21:53:23.562  2426  2549 D StatusBarManagerService: manageDisableList userId=0 what=0x0 pkg=Window{7cde710 u0 d0 p2426 Application Error: dk.jagtlog.googlemaps}
11-05 21:53:23.592  2426  2549 V WindowStateAnimator: Finishing drawing window Window{7cde710 u0 d0 p2426 Application Error: dk.jagtlog.googlemaps}: mDrawState=DRAW_PENDING
11-05 21:53:23.622  2426  2549 V WindowStateAnimator: Finishing drawing window Window{7cde710 u0 d0 p2426 Application Error: dk.jagtlog.googlemaps}: mDrawState=HAS_DRAWN
11-05 21:53:26.942  2426  3054 I ActivityManager: Process dk.jagtlog.googlemaps (pid 15057)(adj 9) has died(112,306)
11-05 21:53:26.942  2426  3054 D ActivityManager: removeProcessNameLocked mProcessNames.remove pid=15057 ,hash=210297115 ,name=dk.jagtlog.googlemaps
11-05 21:53:26.947  2426  2767 I AppOps  : sendInfoToFLP, code=41 , uid=10223 , packageName=dk.jagtlog.googlemaps , type=finishOp
11-05 21:53:26.947  2426  2697 I AppOps  : sendInfoToFLP, code=42 , uid=10223 , packageName=dk.jagtlog.googlemaps , type=finishOp

[wf9a5m75]

Thanks, but it's not enough information. Could you build your app, and commit the APK file to your repo? I will download it, then I'll check the log.

[services4smb]

I have build the app and added it to the repo. Please find the app in the apk folder.

[wf9a5m75]

Thank you. I found a bug in native code. Please reinstall the dev version plugin.

$> ionic cordova plugin rm cordova-plugin-googlemaps

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

[services4smb]

Thank you so much @wf9a5m75 - now custom markers from the internet works in native Android builds, but referring to an PNG in the assets folder now shows a 'default' red marker instead of the PNG file.

Could you please take a look on this issue as well?

I have tried the following URL's, but all shows the 'default' red marker:

icon: {
    url: 'assets/image/map_marker_crosshair_orange.png'
}

icon: {
    url: './assets/image/map_marker_crosshair_orange.png'
}

icon: {
    url: 'www/assets/image/map_marker_crosshair_orange.png'
}

[wf9a5m75]

I fixed. Please reinstall it.

[services4smb]

Awesome @wf9a5m75 now it rocks! :-)

Thank you for fast support and fixes.