...
Chart Data
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
private static ChartTableModel createChartTableModel() {
// 21 rows and 3 columns
Object[][] dataArray = { { 5.55, 10.11, 20.22 }, { 30.33, 40.44, 50.55 }, { 31.33, 99.44, 150.55 },
{ 32.33, 1.44, 30.55 }, { 34.33, 88.44, 77.55 }, { 35.33, 22.44, 54.55 }, { 36.33, 33.44, 52.55 },
{ 37.33, 76.44, 54.55 }, { 38.33, 7.44, 59.55 }, { 39.33, 48.44, 56.55 }, { 40.33, 19.44, 57.55 },
{ 50.33, 104.44, 36.55 }, { 60.33, 23.44, 74.55 }, { 20.33, 90.44, 80.55 }, { 60.33, 18.44, 27.55 },
{ 10.33, 22.44, 97.55 }, { 20.33, 59.44, 55.55 }, { 90.33, 140.44, 22.55 }, { 100.33, 56.44, 76.55 },
{ 40.33, 50.44, 50.55 }, { 60.66, 70.77, 80.88 } };
ChartTableModel data = new ChartTableModel();
data.setData(dataArray);
// give names to the categories
data.setColumnName(0, "budget");
data.setColumnName(1, "sales");
data.setColumnName(2, "forecast");
// give names to the series
final String ROW_NAME_KEY = "row-name";
data.setRowMetadata(0, ROW_NAME_KEY, "1");
data.setRowMetadata(1, ROW_NAME_KEY, "2");
// ----- lines omitted -----
data.setRowMetadata(20, ROW_NAME_KEY, "21");
return data;
}
|
...
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
<chart xmlns="http://reporting.pentaho.org/namespaces/charting/1.0">
<!-- external style sheet -->
<stylesheet href="theme.css" />
<!-- chart title -->
<title>Bar Chart Using Pentaho ChartBeans</title>
<!-- styling on individual series using style and class attributes -->
<series style="-x-pentaho-chart-series-type: bar; -x-pentaho-chart-bar-style: bar;" class="series1" />
<series class="series2" />
<!-- lines omitted -->
<series class="series18" />
<!-- wrap colors because there are more series than colors in the theme -->
<series class="series1" />
<series class="series2" />
<series class="series3" />
<!-- styling on plot using style attribute -->
<plot style="-x-pentaho-chart-orientation: horizontal"/>
</chart>
|
Chart CSS
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
.series1 {
color: #2D00FF;
-x-pentaho-chart-line-width: 2px;
}
.series2 {
color: #11FFE4;
-x-pentaho-chart-line-width: 2px;
}
/* lines omitted */
.series18 {
color: #B7FFE5;
-x-pentaho-chart-line-width: 2px;
}
|
Generating Charts
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
public static void main(String[] args) throws Exception {
// "boot" ChartBeans
ChartBoot.getInstance().start();
// render chart using JFreeChart plugin for Pentaho ChartBeans
renderUsingJFreeChartPlugin("chartdocs/Bar.xml", createChartTableModel());
// render same chart using Open Flash Chart plugin for Pentaho ChartBeans
renderUsingOpenFlashChartPlugin("chartdocs/Bar.xml", createChartTableModel());
}
|
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
private static void renderUsingJFreeChartPlugin(final String chartDocFilename, final ChartTableModel chartTableModel)
throws Exception {
final IChartPlugin plugin = ChartPluginFactory.getInstance("org.pentaho.chart.plugin.jfreechart.JFreeChartPlugin");
// use the same filename as the chartDocFilename except with a different extension
String chartOutputFilename = "chartoutput/"
+ chartDocFilename.substring(chartDocFilename.indexOf(File.separatorChar), chartDocFilename.indexOf('.'))
+ ".png";
URL chartURL = new File(chartDocFilename).toURL();
ChartDocumentContext cdc = ChartFactory.generateChart(chartURL, chartTableModel);
IOutput output = plugin.renderChartDocument(cdc, chartTableModel);
OutputUtils.persistChart(output, chartOutputFilename, IOutput.OutputTypes.FILE_TYPE_PNG, 400, 400);
}
|
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
private static void renderUsingOpenFlashChartPlugin(final String chartDocFilename,
final ChartTableModel chartTableModel) throws Exception {
final IChartPlugin plugin = ChartPluginFactory
.getInstance("org.pentaho.chart.plugin.openflashchart.OpenFlashChartPlugin");
URL chartURL = new File(chartDocFilename).toURL();
ChartDocumentContext cdc = ChartFactory.generateChart(chartURL, chartTableModel);
IOutput output = plugin.renderChartDocument(cdc, chartTableModel);
ByteArrayOutputStream tmpOut = new ByteArrayOutputStream();
output.persistChart(tmpOut, IOutput.OutputTypes.DATA_TYPE_STREAM, 400, 400);
final String ENCODING = "UTF-8";
ByteArrayInputStream in = new ByteArrayInputStream(tmpOut.toByteArray());
IOUtils.closeQuietly(tmpOut);
String openFlashChartJson = IOUtils.toString(in, ENCODING);
IOUtils.closeQuietly(in);
final String HTML_TEMPLATE = "<html>\n" + " <head>\n"
+ " <title>Bar Chart Using Open Flash Chart Plugin</title>\n"
+ " <script type=\"text/javascript\">window.getChartData = function() '{' return ''{0}''; '}'</script>\n"
+ " </head>\n" + " <body>\n"
+ " <object id=\"ofco00b1c87708fe11dea97da1e1ba5b86bc\" height=\"100%\" align=\"middle\" width=\"100%\" \n"
+ " codebase=\"http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0\" \n"
+ " classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\"> \n"
+ " <param value=\"sameDomain\" name=\"allowScriptAccess\"/><param value=\"opaque\" name=\"wmode\"/> \n"
+ " <param value=\"open-flash-chart.swf?get-data=getChartData\" name=\"movie\"/> \n"
+ " <param value=\"high\" name=\"quality\"/><embed id=\"ofce00b1c87708fe11dea97da1e1ba5b86bc\" \n"
+ " height=\"100%\" align=\"middle\" width=\"100%\" \n"
+ " pluginspage=\"http://www.macromedia.com/go/getflashplayer\" type=\"application/x-shockwave-flash\" \n"
+ " allowscriptaccess=\"sameDomain\" bgcolor=\"#FFFFFF\" quality=\"high\" wmode=\"opaque\" \n"
+ " src=\"open-flash-chart.swf?get-data=getChartData\"/></object>\n" + " </body>\n" + "</html>";
String html = MessageFormat.format(HTML_TEMPLATE, new String[] { openFlashChartJson });
String chartOutputFilename = "chartoutput/"
+ chartDocFilename.substring(chartDocFilename.indexOf(File.separatorChar), chartDocFilename.indexOf('.'))
+ ".html";
FileUtils.writeStringToFile(new File(chartOutputFilename), html, "UTF-8");
}
|
Troubleshooting
What can go wrong? Cover common and known problems, then cover how you can discover the root of a problem (logging, debugging symbols, etc.)
...