gMaps and ajax loading issue

[craigphz]

Hi again!

Ref. this post.

Hello,

For the gmaps you just need to call that function:

$(“#googlemaps”).gMap(mapSettings);
But make sure you have the other variables (mapSettings, mapMarkers, etc…) available in the same scope.

Let me know if you have any questions.

Thanks.

$(“#googlemaps”).gMap(mapSettings); added to the pjax success callback works well as long as the Contact Us page was the last page to be fully loaded. I guess this is, as you suggest, because the variables aren’t in scope (learning more now about what this means ;o) otherwise and, so, a TypeError is returned.

I tried including the gmaps chunk:

		<script src="vendor/jquery.gmap/jquery.gmap.js"></script>
		<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
		<script>

			/*
			Map Settings

			..............

			// Map Center At
			var mapCenterAt = function(options, e) {
				e.preventDefault();
				$("#googlemaps").gMap("centerAt", options);
			}

		</script>

in the pjax partial and it appears in the ajax response but the TypeError occurs ( var map = $(“#googlemaps”).gMap(mapSettings); ).

Browsed for solutions to no avail so far. Wondering if you can help further? URL of the dev site provided. Thanks!

---

[Support]

Hello, my guess is that you need to add the API in the HEAD of the main file and remove it from the partial file:

<script src="http://maps.google.com/maps/api/js?sensor=false"></script>

The problem is related to the Google API not being found, so please try that and let me know if the problem persists.

Kind Regards,

Jonas

---

[craigphz]

Thanks for your support!

I feel it’s almost there… I’ve added the API in the HEAD, removed the gMap chunk from the partial file and added the chunk (without the API) to the $(document).on('ready pjax:end', function(e) callback in custom.js (lines 542 to 594).

Now the behaviour is reversed to before: the map loads well if the Contact Us page is loaded via pjax but not if it’s fully loaded.

Tried many different permutations and checked SO for solutions so far… I’d appreciate any suggestions 🙂

---

[Support]

Hello, I’m sorry, but I really don’t know what else to suggest to fix the problem.

If you could send me an e-mail with FTP credentials so I can make a few more tests, would be great.

Kind Regards,

Jonas

---

[craigphz]

Hi! Thanks for your kind offer… it looks here that it’s okay now after a couple more tweaks. Perhaps you could confirm that the map shows on your device(s) in all cases:

1. Full load
2. Partial (pjax) load via a link
3. Back and forward browser buttons

Thanks again for your wonderful support!

---

[Support]

Hello,

1. Full load: Worked
2. Partial (pjax) load via a link: If I click in the contact-us link in the footer it doesn’t work.
3. Back and forward browser buttons: Worked

Kind Regards,
Jonas

---

[Author]

Posts