Google Maps API Tutorial

Translate this page:

Communicating between iframes

I don't think it's possible to pass references to complex Objects, like GMarker()s, between iframes. What you can do instead is to have "helper" functions in the target iframe that accepts simple Objects, like Numbers and Strings, and obtains references to the complex objects within that iframe.

Here's a simple example

This example has two iframes, one for the map and one for the sidebar.

Only frame1 loads the Google Maps API code.
It loads the XML for the markers in the normal way and adds them to the map. It builds up the sidebar contents in the normal way, but instead of putting them into document.getElementById("side_bar"), it sends the contents to a helper function in frame2. parent.frame2.sideBar(side_bar_html)

The helper function in frame2 takes the passed string and places in its local "side_bar" div.

Once the side bar has been passed, frame2 contains a series of calls like
<a href="javascript:parent.frame1.myclick(1)">. These pass a simple number to the "myclick()" helper function that lives in frame1.

Warning

Debugging Javascript that crosses between iframes is significantly harder than debugging Javascript that operates in a single frame.

Back to Mike's Homepage
Up to the start of this tutorial