Menu
I am developing an Ionic application where I'm using the side-menu. When navigating to a template that's only a div for rendering Google Maps (native using cordova-plugin-maps). The side-menu is overlayed over the map. The weird thing is I can interact with the map through the side-menu.
It works fine when using Javascript Google Maps.
Here's a screenshot of how it looks:
The same thing appears on an Android device.
The help in resolving is highly appreciated!!
EDIT: I forgot to mention that I'm transitioning from a normal page (not the side-menu), hence the back button above. I hope that makes it more specific.
951
In order to use the Google Maps SDK, you'll need to create a Google Cloud account and create your project. Within your project, you should enable the Android, iOS, and JavaScript Maps SDKs. Once you've enabled the SDKs, you can create an API Key to include in your project.
Google Map Integration Related Configuration :Create one project and name as per your choice. Enable Google Map SDK for Android & iOS Platforms in Google Developers Console. You will get Google Map API Key through Credential Page. Select your project and then click on Create Credentials button and choose the API key.
This works for me: 1. Place ng-hide to
<ion-side-menu side="left" data-ng-hide="hideLeft">
// hack sidemenu overlay
$scope.$watch(function () {
return $ionicSideMenuDelegate.getOpenRatio();
}, function (newValue, oldValue) {
if (newValue == 0) {
$scope.hideLeft = true;
} else {
$scope.hideLeft = false;
}
});
108
scss ionic.app.scss or www/csss/
body.menu-open .menu.menu-left {
visibility: visible;
}
.menu.menu-left {
visibility: hidden;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
