<body><script type="text/javascript"> function setAttributeOnload(object, attribute, val) { if(window.addEventListener) { window.addEventListener("load", function(){ object[attribute] = val; }, false); } else { window.attachEvent('onload', function(){ object[attribute] = val; }); } } </script> <iframe src="http://www.blogger.com/navbar.g?targetBlogID=16506996&amp;blogName=The+Digital+Voice&amp;publishMode=PUBLISH_MODE_BLOGSPOT&amp;navbarType=BLACK&amp;layoutType=CLASSIC&amp;homepageUrl=http%3A%2F%2Fdigiassn.blogspot.com%2F&amp;blogLocale=en_US&amp;searchRoot=http%3A%2F%2Fdigiassn.blogspot.com%2Fsearch" marginwidth="0" marginheight="0" scrolling="no" frameborder="0" height="30px" width="100%" id="navbar-iframe" title="Blogger Navigation and Search"></iframe> <div></div>
The Digital Voice

News Relating to Programming, Network Security, and Technology 


Monday, December 10, 2007

10:30 PM - BIRT: Dynamic Images

There was a question on the BIRT newsgroup about how to put a dynamic image into a report file. This is typically done in multi-company sites, where a different header or logo will appear based on some environmental parameter. In the following example I will show how to do this with a report parameter, although the same thing can be done based on a URL.

The following example will show one of two logos, depending on the value of a report parameter. If the value is equal to 0, we will show the Eclipse logo at

http://www.eclipse.org/eclipse.org-common/themes/Phoenix/images/eclipse_home_header.jpg

If the value is 1, we will show the BIRT Exchange logo:

http://www.birt-exchange.com/themes/birt/images/homep_r1_c1.gif

This image will reside in the Master Page of the report. So lets take a look at how to do this.

  1. First, create a new report called DynamicImage.rptDesign

Figure 1. Create new Report

  1. In the new report design, open up the Master Page tab.
  2. Drag over a grid, and make it 2 column, 1 row.
  3. In the 1st column, drag over an Image component.
  4. For the URL, put in “http://www.eclipse.org/eclipse.org-common/themes/Phoenix/images/eclipse_home_header.jpg”. Be sure to keep the quotes. This is more as a place holder than anything else.

Figure 2. Master Page with Image

  1. Create a new report parameter called imageSelector. It needs to be an Integer type. In the following screen shot, I am using a List Box and a List of Values for this purpose.

Figure 3. Create new Parameter

  1. Select the Image.
  2. Open the Script tab in the Report Designer
  3. Change the Event to onRender.
  4. Use the following BIRT Script
if (params["imageSelector"] == 0)
{
this.setURL("http://www.eclipse.org/eclipse.org-common/themes/Phoenix/images/eclipse_home_header.jpg");
}
else
{
this.setURL("http://www.birt-exchange.com/themes/birt/images/homep_r1_c1.gif");
}

  1. Save and run.

When you set the value to Eclipse, it will show the Eclipse logo. When set to the BIRT Exchange, it will show that logo.

Figure 4. The Final Report


Anonymous Sulay said...

that was alomst exactly was i was looking for. thx a lot.

i will have to choose a uri based on a value in my dataSet, so i need to access the dataSet from the script.. hope to find an example.  


Blogger Jassi said...

how we can change image name dynamically for dynamic image  


Post a Comment

© John Ward 2005 - Powered for Blogger by Blogger Templates