Controlling in an <iframe> or Popup

TerriaJS can be configured to accept messages posted to it by its parent window. This is useful when embedding a TerriaJS app in an iframe and when the parent wants to send more data to the embedded app than can be reasonably included in a URL.

First, the TerriaJS app must include a line like this:

updateApplicationOnMessageFromParentWindow(terria, window);

Then, the parent window can send messages like this:

<!DOCTYPE html>
<html lang="en">
        <meta charset="utf-8" />
        <title>NationalMap Embed Test</title>


        <script type="text/javascript">
            window.addEventListener("message", function (e) {
                var iframeWindow = document.getElementById(
                if (e.source === iframeWindow && === "ready") {
                    // NationalMap is ready to receive messages!
                            initSources: [
                                    initialCamera: {
                                        north: -33.827,
                                        east: 151.249,
                                        south: -33.907,
                                        west: 151.165
                                    workbench: ["my-data"],
                                    catalog: [
                                            type: "group",
                                            name: "Foo",
                                            members: [
                                                    type: "csv",
                                                    name: "My Data",
                                                    id: "my-data",
                                                        "POA,Some Value\n2000,1\n2205,2"

Notice that parent is creating a CSV catalog item with embedded data. The CSV is only two lines in this case, but in a real application it could be large, much larger than could fit in a URL.