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

Discussion in 'Javascript' started by Javier, Aug 11, 2009.

  1. Javier

    Javier Guest

    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.
    Javier, Aug 11, 2009
    #1
    1. Advertising

  2. Javier wrote:

    > 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,

    --
    Bart
    Bart Van der Donck, Aug 11, 2009
    #2
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Replies:
    12
    Views:
    230
  2. Adrian
    Replies:
    4
    Views:
    132
  3. Bart Van der Donck

    AJAX Cross Domain

    Bart Van der Donck, Dec 8, 2007, in forum: Javascript
    Replies:
    8
    Views:
    315
    Bart Van der Donck
    Dec 9, 2007
  4. Replies:
    5
    Views:
    230
    Thomas 'PointedEars' Lahn
    Nov 24, 2009
  5. leonardo
    Replies:
    0
    Views:
    157
    leonardo
    Nov 18, 2012
Loading...

Share This Page