Custom Marker Icon shows on browser but not on Android
XavG opened this issue · comments
I'm submitting a ... (check one with "x")
- question
- any problem or bug report
- feature request
If you choose 'problem or bug report', please select OS: (check one with "x")
- Android
- iOS
- Browser
cordova information: (run $> cordova plugin list
)
cordova-androidx-build 1.0.4 "cordova-androidx-build"
cordova-plugin-add-swift-support 2.0.2 "AddSwiftSupport"
cordova-plugin-advanced-http 2.5.1 "Advanced HTTP plugin"
cordova-plugin-camera 4.1.0 "Camera"
cordova-plugin-camera-preview 0.11.2 "cordova-plugin-camera-preview"
cordova-plugin-device 2.0.3 "Device"
cordova-plugin-facebook4 6.4.0 "Facebook Connect"
cordova-plugin-file 6.0.2 "File"
cordova-plugin-geolocation 4.0.2 "Geolocation"
cordova-plugin-googlemaps 2.8.0-20200709-2008 "cordova-plugin-googlemaps"
cordova-plugin-googleplus 8.5.0 "Google SignIn"
cordova-plugin-inappbrowser 4.1.0 "InAppBrowser"
cordova-plugin-ionic 5.4.7 "cordova-plugin-ionic"
cordova-plugin-ionic-keyboard 2.2.0 "cordova-plugin-ionic-keyboard"
cordova-plugin-ionic-webview 5.0.0 "cordova-plugin-ionic-webview"
cordova-plugin-screen-orientation 3.0.2 "Screen Orientation"
cordova-plugin-sign-in-with-apple 0.1.2 "cordova-plugin-sign-in-with-apple"
cordova-plugin-splashscreen 5.0.4 "Splashscreen"
cordova-plugin-statusbar 2.4.3 "StatusBar"
cordova-plugin-whitelist 1.3.4 "Whitelist"
cordova-sqlite-storage 4.0.0 "Cordova sqlite storage plugin - cordova-sqlite-storage plugin version"
es6-promise-plugin 4.2.2 "Promise"
Error: ENOENT: no such file or directory, open '/home/cysec/.config/configstore/cordova-config.json'
If you use @ionic-native/google-maps
, please tell the package.json (only @ionic-native/core
and @ionic-native/google-maps
are fine mostly)
??
Current behavior:
- FIRST
Everything was working perfectly, I managed to display a map with several marker with custom icon and htmlinfo.
Here the code :
this.map.addMarker({
icon: 'assets/icon/location.png',
animation: 'DROP',
position: {
lat: institute.lat,
lng: institute.lng
}
}).then((marker: Marker) => {
const infoWindow = this.createSnippet(institute);
marker.on(GoogleMapsEvent.MARKER_CLICK).subscribe(() => {
infoWindow.open(marker);
});
});
- SECOND
I made an update Ionic or this plugin I don't really know, but suddenly my icon was replace with the default maps red Icon.
I also had the famous "width undefined" error.
After some research I modify the code remove the error and hopefully get my icon back.
this.map.addMarker({
icon: {
url: 'assets/icon/location.png',
size: {
width: 36,
height: 36
} },
position: {
lat: institute.lat,
lng: institute.lng
}
}).then((marker: Marker) => {
const infoWindow = this.createSnippet(institute);
marker.on(GoogleMapsEvent.MARKER_CLICK).subscribe(() => {
infoWindow.open(marker);
});
} , (err) => {
console.error('Tab2::LoadInstitutes.marker.on() ::: ' + JSON.stringify(err));
});
And know the strange part ... It works on the browser ! (with the command ionic cordova run browser
)
But not in android, by ionic cordova run android
and even if I get the app by the android store.
So the path is right. I don't understand where is the problem. I don't get any error message with adb logcat
.
Expected behavior:
Show my custom Icon for every marker on browser ,android and IOS
Hello ?
hello XavG
for me it worked like this
url: './assets/icon/location.png'
add in the path './'
I'm using:
"@ionic-native/google-maps": "^5.5.0",
Oh my god, that's it .. it works !
Thanks you very much !! :)