Skip to content
New issue

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

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

Already on GitHub? # 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

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

No branches or pull requests

2 participants