Ionic native google maps plugin doesn't show map after getRootNav().push() - google-maps

I'm using Ionic 3 and working on iPhone 7 plus with iOS 11. I'm using the Ionic native google maps plugin (http://ionicframework.com/docs/native/google-maps/). I have two sets of tabs (user/admin) and I need to switch between them with the following code:
switch() {
this.app.getRootNav().push(tabs2);
}
If I've loaded the map on Tabs1 and then move to Tabs2 and back to Tabs1 and try to load the map again, it doesn't load and only shows white screen.
I've seen solutions for this in other posts, where it was advised to "resize" the map in order to load it with the following code:
google.maps.event.trigger(this.map, 'resize');
As far as I know this is NOT the ionic native plugin (it's the JS web version). I'm having trouble in implement the same functionality with the native plugin. Or really any other solution will work just fine as well.

You need to detach the map before going back to Tabs1 from Tabs2.
// Detach
this.map.setDiv(null);
// Attach again
this.map.setDiv(div);
If you create a demo project, and share it on github, I will check it.

Related

The native map in ionic 3 doesn't work

I followed this repo to create the google map native in Ionic
ionic google maps demo
I can not debug to see what's happened, only white screen.
I used native/core: 4.7.0 and #ionic-native/google-maps: ^4.7.0 and cordova-plugin-googlemaps: 2.2.9.
I enabled google map API already, and get the right key
Are you testing it on the browser? cordova-plugin-googlemaps is a native plug-in and cannot be view on browser. For testing, you will need to build it and test it on your device.
Read more here: https://ionicframework.com/docs/v1/guide/testing.html

Map View in flutter

Is there any way how make normal Map View in flutter. I need to have map ready when user opens the app. Only thing I saw, is that apptree plugin, but I could only make the map appear after user taps the button (and fullscreen, I need to put it into container). Basicaly what I need is some Map Widget, is there any ?
You can use some plugin like
https://github.com/apptreesoftware/flutter_google_map_view
flutter plugin for displaying google maps on iOS and Android
//Create an instance variable for the mapView
var _mapView = new MapView();
//Add a method to call to show the map.
void showMap() {
_mapView.show(new MapOptions(showUserLocation: true));
}
Unfortunately this is one of the drawbacks of choosing to render own components on GPU instead of using OEM solutions, they need to bake GMaps renderer over Flutter APIs and probably will, in the meanwhile, try this implementation: https://github.com/apptreesoftware/flutter_map

image overlay on Ti.Map of Titanium

I am making application on Titanium for iOS and android.
This application uses Ti.Map.
I would like to add image on Ti.Map (google map or apple map)
I have confirmed googlemap API has this function like this below.
Adding a Custom Overlay
I have checked methods of Ti.Map and found createCircle or createPolygon....However these methods are not what I want.
Can I add image as overlay on Ti.Map of Titanium????
No. Ti.Map is very basic and only provides for polylines, polygon and marker additions, but not customizing of the view. If it were possible, it would be only on Android because that is Google Maps.
For your cause, I suggest you add a webview to your app, and use the JavaScript API of Google Maps to fix this. And within this webview add a full size Google Map, so you will not see any borders whatsoever. Should work perfectly fine!

which google map plugin used cordova ionic framwork within ion-view

What is the best plugin to display google map on cordova? withh ionic framework within the ion-view tag.
I am trying google map plugin but no avail.
Geo location plugin will not help you display map its just for only finding long & lat based on current your location.
I you want display map, try this plugin https://github.com/wf9a5m75/phonegap-googlemaps-plugin
Or it can be possible without plugin also please follow below link
https://developers.google.com/maps/documentation/javascript/examples/map-simple
If you want sample Ionic Google map try following command
ionic start myApp maps
https://github.com/driftyco/ionic-starter-maps
Use Geolocation
enter the following line in your cmd to add this plugin
cordova plugin add org.apache.cordova.geolocation

Google ios sdk mapview with storyboards

Can you advise if storyboards are supported with google maps ios sdk v 1.1. I'm getting some strange results
I have to 2 view controllers for maps. The first one displays a single map and renders absolutely fine as it pushed onto the navigationcontroller using storyboard push segue..
I have another map viewcontroller which is loading multiple markers. This view controller is also on the storyboard but loaded using a custom transition to fade in.
I am loading the views as per the sdk examples in the loadView method.
I have 3 problems with it
1.The first time the map with multiple markers is loaded the map does not get displayed/rendered. When i tap the button to display the view again (which does nothing if the view is loaded) it then renders the map and markers.
2.I close this view and load another view using the custom segue. if i go back to the map view with multiple markers i get an exception in the loadview method when it tries to assign the mapview to the view
*** Terminating app due to uncaught exception 'UIViewControllerHierarchyInconsistency', reason: 'A view can only be associated with at most one view controller at a time! View <GMSVectorMapViewBridge: 0x150376a0; frame = (0 0; 320 416); layer = <CALayer: 0x15055cd0>> is associated with <GMMapResultsViewController: 0x10faa2a0>. Clear this association before associating this view with <GMMapResultsViewController: 0xb51ad90>.
3.Lastly if i load the first map view controller with asingle marker, it loads fine, then I return to the 2nd map view controller with multiple markers. The same problem occurs when rendering the map. then if i try to select a map marker it is not handled by the delegate. Even though it would work ok if i loaded this map the first time.
I suspect if you do the following, your problem may go away...
add a UIView into the view controller where you're working
set it's type to be GMSMapView in the identity inspector.
Then control-drag it to your code as you would for any other outlet.
Once you've done this working with the Google maps becomes quite easy.
In case anyone needs a working example: Google Maps SDK 1.1.2 with Storyboards. You can find it on github: https://github.com/rendulic/GMaps3D