How to load a GMAP into a Div using Ajax. cross-domain problem??

Javier · Aug 11, 2009

Hi,
I have a problem trying to load a GoogleMaps map into a Div using
Ajax.
Basically I have main.php with a Div inside that is loaded with the
content of other pages like map.php.
When I try to load the content into the Div, It recognizes javascript
code, but no the javascript code of the map, so I think it's a cross-
domain problem.....
My question is: Is it possible to avoid this problem? How can I do a
very simple action like loading a Gmaps map into a Div?
Thanks for your time.
Javier.

Bart Van der Donck · Aug 11, 2009

Javier said:
I have a problem trying to load a GoogleMaps map into a Div using
Ajax.
Basically I have main.php with a Div inside that is loaded with the
content of other pages like map.php.
When I try to load the content into the Div, It recognizes javascript
code, but no the javascript code of the map, so I think it's a cross-
domain problem.....
My question is: Is it possible to avoid this problem? How can I do a
very simple action like loading a Gmaps map into a Div?

Hard without looking at the code, but at first sight I would not
suspect a cross-domain problem, since the javascripts are loaded from
Google and should always be executable (no cross-domain limitation
here).

You mention AJAX, so I suppose you are using Google's AJAX API. Could
you run the following test in a standalone page (map.html) ?

--------------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Load Google map in a div</title>
<script type="text/javascript"
src="http://www.google.com/jsapi?key=YOURKEYHERE"></script>
</script>
<script type="text/javascript">
google.load('maps','2');
function loadmapdiv() {
var map = new google.maps.Map2(document.getElementById('mydiv'));
map.setCenter(new google.maps.LatLng(50,5),5);
}
</script>
</head>
<body>
<div id="mydiv"
style="width:300px; height:300px; background-color:silver;"></div>
<a href="#" onClick="loadmapdiv(); return false;">Load map in div</a>
</body>
</html>
--------------------------------------------------------------------

Then embed it into a PHP file (map.php), and finally embed that PHP-
file into another one (main.php).

Hope this helps,

How to make a div select work?	5	Jan 13, 2022
Survey details won't go through using php, ajax, Mysql	0	Oct 26, 2023
How can I hide a div using an event listener on multiple checkboxes?	6	Dec 23, 2022
Firefox and cross domain ajax calls	5	Nov 23, 2009
How to not load an insanely big dataset in less than 50 hrs	1	Sep 2, 2023
Checking dynamically populated data using ajax with user entered value	5	Apr 11, 2020
NEED HELP How to refresh animation so the rest of page can load	0	Oct 4, 2021
How to submit form after calling curl post	4	Jan 1, 2023

How to load a GMAP into a Div using Ajax. cross-domain problem??

Javier

Bart Van der Donck

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads