Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Markers don't show up on initial page load after MAP_READY #2793

Closed
2 of 5 tasks
Filavision opened this issue Jun 9, 2020 · 7 comments
Closed
2 of 5 tasks

Markers don't show up on initial page load after MAP_READY #2793

Filavision opened this issue Jun 9, 2020 · 7 comments

Comments

@Filavision
Copy link

Filavision commented Jun 9, 2020

I'm submitting a ...

  • question
  • any problem or bug report

OS:

  • Android
  • iOS
  • Browser

Phonegap Version: cli-9.0.0
Plugins:

  • cordova-plugin-whitelist v1.3.4
  • cordova-plugin-splashscreen v5.0.4
  • cordova-plugin-googlemaps v2.7.1

Current behavior:
Hey!
When i load a map on Android and set markers after MAP_READY was fired, the markers don't show at the first page load. When i reload the page the markers will show up. I think it's because the map images are in the cache. When i add a timeout to the MAP_READY event, the markers show up also at the first load.

[Android]
Without setTimeout, no markers show up on the initial load of the page:

var myMarkers = [
{position: {lng: 115.140923, lat: -8.656873}},
{position: {lng: 115.128372, lat:-8.657434}}
];

var mapDiv = document.getElementById("spot-map");

var spotMap = plugin.google.maps.Map.getMap(mapDiv, {
mapType: plugin.google.maps.MapTypeId.HYBRID,
camera: {target: {lat: -8.660232, lng: 115.130257}, zoom: 14},
controls: {compass: false, myLocation: true, myLocationButton: false, indoorPicker: false, zoom: false},
gestures: {scroll: false, tilt: false, rotate: false, zoom: false}
});

spotMap.on(plugin.google.maps.event.MAP_READY, function(){
var bounds = [];
var markers = myMarkers.map(function(options){bounds.push(options.position);return spotMap.addMarker(options);});
});

When i add a timeout, it works:

spotMap.on(plugin.google.maps.event.MAP_READY, function(){
setTimeout(function(){
var bounds = [];
var markers = myMarkers.map(function(options){bounds.push(options.position);return spotMap.addMarker(options);});
},1000);
});

Looks like the MAP_READY event is to fast?!

@wf9a5m75
Copy link
Member

wf9a5m75 commented Jun 9, 2020

Could you clean up your post?
#2661

@wf9a5m75
Copy link
Member

wf9a5m75 commented Jun 9, 2020

And what version number of this plugin do you use?

@Filavision
Copy link
Author

Filavision commented Jun 9, 2020

Current version (2.7.1 from npm) build with build.phonegap.com

@wf9a5m75
Copy link
Member

wf9a5m75 commented Jun 9, 2020

Could you try the multiple_maps branch version?
You can specify https://github.com/mapsplugin/cordova-plugin-googlemaps#multiple_maps

@Filavision
Copy link
Author

Markers works with this version but now i can't open a second map. When i open the first page, the map and the markers load. I go back and open another page with other coordinates, the map shows the first map (position) and i can't scroll or zoom.

@wf9a5m75
Copy link
Member

wf9a5m75 commented Jun 9, 2020

Ok, could you share your project files on GitHub repository? I need to know more details about your code.

@wf9a5m75
Copy link
Member

ping

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants