creating data driven web apps with birt - pierre richer (actuate)

1Actuate Corporation © 2012

Creating Data Driven Web Apps with BIRT

Pierre Richer

2Actuate Corporation © 2012

Today’s Agenda and Goals

• Introduction to BIRT• Designing BIRT Reports

• Designer• APIs

• Deploying BIRT• BIRT Viewer• Report Engine (Java)• JavaScript API

• Questions

3Actuate Corporation © 2012

Introduction to BIRT

4Actuate Corporation © 2012

Actuate Launches the BIRT Project

AUGUST

2004

Actuate Joins Eclipse Foundation

as Strategic Developerand Board Member

Actuate proposed and started

BIRTBusiness Intelligence

and Reporting Tools Project

… a top-level Eclipse projectAdds BI and Reportingas Open Source Project

Professional open sourcePrimary development resources

funded by Actuate

Contributions from many sourcesIBM, Innovent Solutions and community

5Actuate Corporation © 2012

BIRT Release History

September 2004 BIRT Project proposal accepted, and project launched

June 2005 1.0 Eclipse Report Designer, Report Engine, Chart Engine

December 2005 2.0 Support for a wide variety of common layouts

June 2006 2.1 Advanced parameters, ability to join data sets, …

June 2007 2.2 Dynamic crosstab support, web services data source, …

June 2008 2.3 JavaScript Debugger, BiDi Support, Charts in Crosstabs, …

June 2009 2.5 Page aggregates, Multiple drill-downs in Charts, …

June 2010 2.6 New charts, more chart control, developer productivity, …

June 2011 3.7 POJO Runtime, Hive/Hadoop, Open Office emitters…

June 2012 4.2 Maven Support, Excel Data Source, Relative Time Periods…

June 2013 4.3 MongoDB & POJO ODAs, PPT & Word 2010 Support, XLSX Support…

Ground-up initiative: Innovative approach to layout and designDeveloped in the open with community feedback at all stages

6Actuate Corporation © 2012

Simplicity

that makes simple

layouts easy

Power

to createvery complex

layouts

BIRTBIRT

Business Intelligence and Reporting Tools

• Makes all data-driven content development easy• Modern, web-page design metaphor• Open and standards-based• Flexible with rich programmatic control• Full support for libraries and reuse• Foundation for a range of solutions

A New Generation of Data Visualization Technology

7Actuate Corporation © 2012

Designing BIRT Reports

8Actuate Corporation © 2012

• BIRT Offers many ways to get data• Standard Data Sources

• Flat File (CSV, TSV, SSV, PSV)• MongoDB• Hive Data Source• Cassandra Scripted Data Source• JDBC Textual or Graphical• Web Service & XML- XPath syntax• XLS/XLSX

• Scripted Data Source Written in Java or JavaScript

• Open Data Access (ODA) DTP Project• Extensible JDBC Driver Framework

Community ContributionsGoogleDocsXML/ARESTMulti-Flat FileGitHubTwitter JSON SearchDropbox usageYQLGoogle AnalyticsLinkedInFacebook FQL

BIRT Data Access

9Actuate Corporation © 2012

BIRT Formatting Capabilities

• Listings, cross-tab, dashboard, pixel-perfect, charts

• Grouping, advanced aggregations, sub-totals, calculations

• Multi-section and sub-reports• Conditional sections and logic• Full programmatic control and

scripting• Embedded images• Dynamic hyperlinking• And much more!

10Actuate Corporation © 2012

BIRT Productivity Aids

• Graphical layout and design• Query and metadata editors• Customizable cheat sheets

and templates• Formatting builder• Grouping builder

11Actuate Corporation © 2012

BIRT Re-use and Productivity

• Library support for publishing and sharing components• Leverages common standards

• SQL• Java• JavaScript• XML

• Cascading Style Sheets• Integrated debugger

12Actuate Corporation © 2012

BIRT Output Formats

• HTML, PDF, MS Office, Open Office• Custom emitters : CSV, Text, …• Internationalization of labels and text• Localization of date and numeric fields• Support for Asian character sets and right-to-left display

Web Viewer PDF Excel

13Actuate Corporation © 2012

The BIRT Designer

DEMO

14Actuate Corporation © 2012

BIRT Designer BIRT Designer

High-Level BIRT Architecture

BIRT EngineBIRT Engine

PresentationServices

PresentationServices

Design EngineDesign Engine

GenerationServices

GenerationServices

DataServices

DataServices

ChartingEngine

ChartingEngine

EclipseDesigner

EclipseDesigner

ChartDesigner

ChartDesigner

Eclipse DTP,WTP,…

Eclipse DTP,WTP,…

Data

Data

HTMLPDFExcelWordPowerPointPostScript…

XMLDesign

Document

15Actuate Corporation © 2012

Design Engine

Report Engine

Chart Engine

Produces XML Report, Templates, and Library Designs

Runs Reports and produces output – PDF, HTML, Doc, XLS, PS, PPT Etc

Consume Chart EMF model and produces Chart Output. Supports 14 Main types and many sub types. Ouputs to PNG, JPG, BMP, SVG, PDF, SWT, and SWING

DE API

RE API

CE API

All Engines can be ran with or without OSGi

Report Designer Chart Builder Example Viewer

Can be run outside of BIRT

Core BIRT Open Source Products

High Level BIRT Architecture

16Actuate Corporation © 2012

Deploying BIRT Reports

17Actuate Corporation © 2012

Multiple Deployment Options

BIRT Design

BIRT Engine and APIsBIRT onDemand

BIRT iHub

18Actuate Corporation © 2012

BIRT Web Viewer

Copy WebViewerExample from the runtime download to the application server and rename it “birt”

19Actuate Corporation © 2012

BIRT Web Viewer URLs

With viewer toolbar, pagination, etc.:http://localhost:8080/birt/frameset?__report=reportName.rptdesign

As a straight HTML output:http://localhost:8080/birt/run?__report=reportName.rptdesign

Other servlet mappings:preview, document, output, extract

URL parameters include:

id title showtitle toolbar navigationbar locale

format report document parameterpage pagerange fittopage

svg isnull islocale masterpage resourceFolder bookmark

rtl page overwrite

20Actuate Corporation © 2012

BIRT Web Viewer URLs

Output to PDF:http://localhost:8080/birt/frameset?__report=reportName.rptdesign&__format=pdf

To display a single report item as a reportlet:http://localhost:8080/birt/run?__report=SD.rptdesign&__bookmark=myTable&__isreportlet=true

21Actuate Corporation © 2012

BIRT Viewer Tag Library

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>

<%@ taglib uri="/birt.tld" prefix="birt" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

<title>My Report - JSP</title>

</head>

<body>

<birt:viewer id="birtViewer" reportDesign= "Sales Report Summary.rptdesign"

pattern="frameset"

height="450"

width="700"

format="html"></birt:viewer>

</body>

</html>

Example JSP to embed viewer

22Actuate Corporation © 2012

BIRT Viewer Tag Library

…

<html><style type="text/css">

.class1 { background-color:#ff0000; color: #ffffff; }

</style>

<body>

Parameter Page<br> <birt:parameterPage id="report1"  name="page1" reportDesign="cascade.rptdesign" isCustom="true" pattern="frameset">

Cascading Parameter1: <birt:paramDef id="5" name="customer" /> <br><br>  Cascading Parameter2: <birt:paramDef id="6" name="order" cssClass="class1"/> <br><br> 

<input type="submit" name="submit" value="Submit form"/> <br><br> </birt:parameterPage> <br> </body></html>

Example JSP to embed parameters

23Actuate Corporation © 2012

Report Engine API

public class RunReport {

IReportEngine engine=null; IReportRunnable design = null;

RunReport( String birtHome, String logFolder ) throws BirtException { EngineConfig config = null; //Configure the Engine and start the Platform config = new EngineConfig( ); config.setBIRTHome( birtHome );

//set log config config.setLogConfig(logFolder, Level.FINE);

//start the Platform to load the appropriate plug-ins Platform.startup( config );

//get the factory from the platform IReportEngineFactory factory = (IReportEngineFactory) Platform.createFactoryObject( IReportEngineFactory.EXTENSION_REPORT_ENGINE_FACTORY );

//create the engine engine = factory.createReportEngine( config ); }

Example – Running a report

24Actuate Corporation © 2012

Report Engine API

public void run(String designName, String reportDocument) throws EngineException{ design = engine.openReportDesign( designName ); IRunTask task = engine.createRunTask( design );

task.run( reportDocument ); task.close();

}

public void shutdown(){ engine.destroy(); Platform.shutdown();}

public static void main( String[] args ){ String designName = "Reports/Run/OrderStatus.rptdesign"; String reportDocument = "Reports/Run/OrderStatus.rptdocument"; String birtHome = "C:/birt-runtime-4_3_0/ReportEngine" ; String logFolder = "Reports/Logs";

try { RunReport rr = new RunReport( birtHome, logFolder ); rr.run( designName, reportDocument ); rr.shutdown(); } catch (Exception e) {e.printStackTrace();}

System.out.println("RunReport: I am done!");}

25Actuate Corporation © 2012

Report Engine API

public class RunReportPDF {

IReportEngine engine=null; IReportRunnable design = null;

RunReportPDF( String birtHome, String logFolder ) throws BirtException { EngineConfig config = null; //Configure the Engine and start the Platform config = new EngineConfig( ); config.setBIRTHome( birtHome );

//set log config config.setLogConfig(logFolder, Level.FINE);

//start the Platform to load the appropriate plug-ins Platform.startup( config );

//get the factory from the platform IReportEngineFactory factory = (IReportEngineFactory) Platform.createFactoryObject( IReportEngineFactory.EXTENSION_REPORT_ENGINE_FACTORY );

//create the engine engine = factory.createReportEngine( config ); }

Example – Running and rendering a report

26Actuate Corporation © 2012

Report Engine API

public void run(String designName, String reportDocument) throws EngineException{ design = engine.openReportDesign( designName ); IRunTask task = engine.createRunTask( design );

task.run( reportDocument ); task.close();}

public void htmlRender( String docName, String htmlDoc) throws EngineException{ //Open a report document IReportDocument iReportDocument = engine.openReportDocument(docName); IRenderTask task = engine.createRenderTask(iReportDocument);

//Set Render Options HTMLRenderOption options = new HTMLRenderOption(); options.setOutputFileName( htmlDoc ); options.setOutputFormat("html"); options.setHtmlPagination( true );

task.setRenderOption(options);

//Render Pages 2-5 //task.setPageNumber(4); task.setPageRange("2-5"); task.render();}

27Actuate Corporation © 2012

Report Engine API

public void pdfRender( String designName, String pdfDoc) throws EngineException{ //Open a report design - use design to modify design, retrieve embedded images etc. IReportRunnable design = engine.openReportDesign( designName );

//Create task to run the report - use the task to execute and run the report IRunAndRenderTask task = engine.createRunAndRenderTask( design ); //Set parameters for the report task.setParameterValue( "Top Count", new Integer(5) ); task.setParameterValue( "Top Percentage", new Integer(25) ); task.validateParameters(); //Set rendering options - such as file output name and format, etc. PDFRenderOption options = new PDFRenderOption( ); options.setOutputFileName( pdfDoc ); options.setOutputFormat( "pdf" ); task.setRenderOption(options);

//run the report task.run();}

28Actuate Corporation © 2012

Report Engine API

public void shutdown(){ engine.destroy(); Platform.shutdown();}

public static void main( String[] args ){ String designName = "Reports/Run/OrderStatus.rptdesign"; String reportDocument = "Reports/Run/OrderStatus.rptdocument"; String birtHome = "C:/birt-runtime-4_3_0/ReportEngine" ; String logFolder = "Reports/Logs"; String htmlDocument = "C:/webapps/birt/OrderStatus.html"; String pdfDesignReport = "Reports/Run/TopNPercent.rptdesign"; String pdfDocument = "C:/webapps/birt/TopNPercent.pdf";

try { RunReportPDF runReport = new RunReportPDF( birtHome, logFolder, logFlag ); runReport.run( designName, reportDocument ); runReport.htmlRender(reportDocument, htmlDocument); runReport.pdfRender(pdfDesignReport, pdfDocument); runReport.shutdown(); } catch (BirtException e) {e.printStackTrace();}

System.out.println("RunReport: I am done!");}

29Actuate Corporation © 2012

Report Engine API with JSF

public class birt2jsf {

String executeReport(String param) throws EngineException{ IReportEngine engine=null; EngineConfig config = null;

try{ // start up Platform config = new EngineConfig( ); config.setLogConfig("/logs", java.util.logging.Level.FINEST); Platform.startup( config );

// create new Report Engine IReportEngineFactory factory = (IReportEngineFactory) Platform .createFactoryObject( IReportEngineFactory.EXTENSION_REPORT_ENGINE_FACTORY ); engine = factory.createReportEngine( config );

// open the report design IReportRunnable design = null; design = engine.openReportDesign("C:/webapps/JSF_2/test.rptdesign");

// create RunandRender Task IRunAndRenderTask task = engine.createRunAndRenderTask(design);

// pass necessary parameters task.setParameterValue("Country", param); task.validateParameters();

Example – Report Execution

30Actuate Corporation © 2012

Report Engine API with JSF

// set render options including output type HTMLRenderOption options = new HTMLRenderOption(); ByteArrayOutputStream outs = new ByteArrayOutputStream(); options.setOutputStream(outs); options.setImageHandler(new HTMLServerImageHandler()); options.setBaseImageURL("images"); options.setImageDirectory("C:/webapps/JSF_2/images"); options.setEmbeddable(true); options.setOutputFormat("html"); task.setRenderOption(options);

// run task String output; task.run(); output = outs.toString(); task.close(); engine.destroy(); return output; }catch( Exception ex){ ex.printStackTrace(); return "Error"; } finally { Platform.shutdown( ); RegistryProviderFactory.releaseDefault(); } }}

31Actuate Corporation © 2012

Report Engine API with JSF

@ManagedBean(name="birtBean")@SessionScopedpublic class BirtBean implements Serializable { private static final long serialVersionUID = 1L; private String name;

public String getReport() { birt2jsf report = new birt2jsf( ); String reportHTML = null; try { reportHTML = report.executeReport(name); } catch (EngineException e) { e.printStackTrace(); }

return reportHTML; } public String getName() { return name; }

public void setName(String name) { this.name = name; }}

Example – Bean

32Actuate Corporation © 2012

Report Engine API with JSF

<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html">

<h:head>

<title>BIRT JSF 2.0 Example</title>

</h:head>

<h:body>

<h3>Enter Country</h3>

<h:form>

<h:inputText

value="#{birtBean.name}">

</h:inputText>

<h:commandButton value="View Report" action="page-a">

</h:commandButton>

<h:outputText value="#{birtBean.report}" escape="false"/>

</h:form>

</h:body></html>

Example – JSP Code

33Actuate Corporation © 2012

BIRT Viewer Toolkit (BVT) – Sneak Peek

New product being released by Actuate for use with open-source (OS) BIRT. BVT should be released soon for download on BIRT Exchange.Key Features:• It’s FREE!• It uses the Actuate Viewer (Built on OS Viewer)

• More modern look and feel• More seamless parameter entry screen• Calendar date-picker

• It’s built on the latest BIRT version (4.3)• Includes JavaScript API (JSAPI) AJAX library for easier integration into

applications of all types.

34Actuate Corporation © 2012

Running Reports with BVT

The URL’s used with the OS viewer can still be used with BVT.

With viewer toolbar, pagination, etc.:http://localhost:8080/BIRTViewerToolkit/frameset?__report=TableReport.rptdesign

As a straight HTML output:http://localhost:8080/BIRTViewerToolkit/run?__report=TableReport.rptdesign

Output to PDF:http://localhost:8080/BIRTViewerToolkit/frameset?__report=TableReport.rptdesign&__format=pdf

To display a single report item as a reportlet:http://localhost:8080/BIRTViewerToolkit/run?__report=SD.rptdesign&__bookmark=myTable

35Actuate Corporation © 2012

Running Reports with BVT

Parameterized report with date picker:http://localhost:8080/BIRTViewerToolkit/frameset?__report=DynamicParameter.rptdesign

What that looks like with the OS viewer:http://localhost:8080/birt/frameset?__report=DynamicParameter.rptdesign

36Actuate Corporation © 2012

BVT and JSAPI

<html>

<head>

<script type="text/javascript" language="JavaScript src="http://localhost:8700/BIRTViewerToolkit/jsapi"></script>

</head>

<body onload="init();">

<div id="myDivContainer" style="border-width: 1px; border-style: solid;"></div>

<script type="text/javascript" language="JavaScript">

var myViewer;

function init() {

actuate.load("viewer");

actuate.initialize( "http://localhost:8700/BIRTViewerToolkit/", null, null, null, createViewer );

}

function createViewer() {

myViewer = new actuate.Viewer( "myDivContainer" );

myViewer.setReportName("/reports/Customer Listing.rptdesign" );

myViewer.submit();

}

</script>

</body>

</html>

Example – JSAPI to view a report

37Actuate Corporation © 2012

Explore• Search/sort• Rate, comment• Forums

Download• Documentation• Software• Examples

Contribute• BIRT designs, code• Technical tips• Contests

Centralized hub for BIRT developers• Access demos, tutorials, tips and techniques, documentation…• Enables developers to be more productive and build applications faster• Marketplace for applications

BIRT Exchange Community Site

38Actuate Corporation © 2012

Questions?

39Actuate Corporation © 2012

Actuate Products Built on BIRT

BIRT Designer Pro:Enhanced emitters, HTML5 charts, flash charts, flash gadgets, flash maps, additional datasources, progressive viewing, etc.

BIRT Interactive Viewer:Allows end users to add columns, apply formatting, move columns, add charts, sort, etc.

BIRT 360:Create visually pleasing, interactive dashboards quickly an easily using BIRT report components, HTML5 & Flash gadgets, etc.

BIRT Studio:Ad-hoc, web-based reporting tool for business users to create reports easily, without sending requests to IT.

BIRT iHub:Deploy, manage, schedule, run, and distribute BIRT documents and web pages securely and easily.