Using HTML <iframe> tags to display Cognos® TM1 Web objects

Use HTML inline frames (<iframe> tag) to display CubeViewer and Websheet objects with the URL API in your custom web pages.

The <iframe> tag is the primary way to display CubeViewer and Websheet objects in your custom web pages with the URL API.

After a TM1® Web object is displayed in an iframe, you can then apply actions on that object by updating the src (source) property of the iframe with a new URL.

Example

The following example uses a standard HTML button and a JavaScript function to load a Websheet into an iframe.
<!-- Button to load the websheet -->
<button onClick="loadWebsheet();">Load Websheet</button>

<!-- The iframe to host and display the Websheet -->
<iframe id="websheetId" style="width:100%; height:100%;"></iframe>

<script type="text/javascript">

   // The function to assemble the required URL and display the Websheet
   function loadWebsheet() {

      // Get a reference to the iframe
      webSheet = document.getElementById("websheetId");

      // Assemble the URL that specifies the Websheet you want to open
      baseUrl = "http://localhost:9510/tm1web/UrlApi.jsp";
      var websheetURL = baseUrl + "#Action=Open&Type=WebSheet";
      websheetURL = websheetURL + "&Workbook=Applications/Planning Sample/";
      websheetURL = websheetURL + "Management Reporting/Actual v Budget";
      websheetURL = websheetURL + "&AdminHost=localhost&TM1Server=Planning Sample";

      // Assign the URL to the iframe to display the Websheet
      webSheet.src = websheetURL;
   };
</script>