2.1.3 Embedding a Report or Viewsheet
To embed an individual report into an IFrame, use the following syntax,
Replace 'remotehost:8080' with an actual machine name and port.
<iframe src="http://remotehost:8080/sree/Reports?op=frameReplet&name=FolderName/ReportName&outtype=REPORT">
<p>Text for obsolete browsers.</p>
</iframe>
Use “%20” to represent a space in a report or Viewsheet name.
where ReportName is the name of the desired report, and FolderName is the name of the report's containing folder in the Repository.
Similarly, to embed an individual Viewsheet into an IFrame, use the following syntax:
<iframe src="http://remotehost:8080/sree/Reports?op=vs&path=/FolderName/ViewsheetName">
<p>Text for obsolete browsers.</p>
</iframe>
Note: The path does not include explicit reference to 'My Reports', and does not begin with a '/'.
For a user-scope Viewsheet (i.e., a Viewsheet in the 'My Reports' folder), the path should begin with the username. For example, for user 'guest' and a Viewsheet called 'MyViewsheet' residing in 'My Folder' (within 'My Reports') the path should be specified as follows:
<iframe src="http://remotehost:8080/sree/Reports?op=vs&path=guest/My%20Folder/MyViewsheet">
<p>Text for obsolete browsers.</p>
</iframe>
To load the Viewsheet in the Visual Composer, see Embedding the Visual Composer.
This section provides a fuller example of IFrame embedding. the HTML markup below generates a simple web page with two divs, the top div containing a heading and some text, and the bottom div containing an IFrame with embedded report. To run this example, replace “remotehost” with the name of the remote server on which the report engine is running.
<html>
<head>
<title>IFrame Integration Example</title>
<meta http-equiv="content-type" content="text/html;
charset=utf-8" />
<link href="hostStyle.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="TitleDiv">
<h1>IFrame Integration Example</h1>
<p>This is an example of IFrame integration.</p>
</div>
<div id="IFrameDiv">
<iframe src="http://remotehost:8080/sree/Reports?op=frameReplet&name=OrderList" frameborder="1" width="100%" height="100%">
<p>Text for obsolete browsers.</p>
</iframe>
</div>
</body>
</html>
Note: When the div surrounding an IFrame has its 'overflow' property set to 'auto', Internet Explorer may not correctly position the embedded report's context menus.
To control the style of the above HTML, including the size and placement of the div containing the IFrame, you can use a CSS file such as the one below (hostStyle.css).
html, body {
margin:0;
padding:0;
height:100%;
font-family: arial;
}
div {
margin-left: auto;
margin-right: auto;
width: 75%;
padding:0;
background: white;
}
div#IFrameDiv {
height: 75%;
bottom:0;
}
div#TitleDiv {
height: 20%;
text-align:center;
}
| << 2.1.2 Embedding a Tab of the Style Intelligence Portal | © 1996-2013 InetSoft Technology Corporation (v11.4) | 2.1.4 Embedding the Visual Composer >> |