Community Company Search Contact

readme.html from BIRT at Krugle

Show readme.html syntax highlighted

<div align="center"> 
  <p><font size="5" face="Times New Roman, Times, serif"><strong><font face="Arial, Helvetica, sans-serif">Chart 
    API Examples Plugin</font></strong></font></p>
  <p><font face="Times New Roman, Times, serif">Last updated: Jan 20, 2006</font></p>
  <p align="left"><font face="Arial, Helvetica, sans-serif"><strong>Table of Contents</strong></font></p>
</div>
<blockquote> 
  <div align="left"><strong><font size="2" face="Arial, Helvetica, sans-serif">Prefix</font></strong></div>
  <div align="left"> 
    <p><font size="-1" face="Arial, Helvetica, sans-serif"><a href="#000"> How 
      to run the examples?</a></font></p>
    <p> </div>
  <div align="left"><font size="2" face="Arial, Helvetica, sans-serif"><strong>1. 
    Sample Charts written by API </strong>(org.eclipse.birt.chart.examples.api)</font></div>
  <div align="left"></div>
  <div align="left"> 
    <p><font size="2" face="Arial, Helvetica, sans-serif"> 1.1- Use different 
      renderers to present various types of charts (org.eclipse.birt.chart.examples.api.viewer)</font></p>
  </div>
  <blockquote> 
    <div align="left"></div>
    <div align="left"> </div>
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.1.1 
      <a href="#111">SWING Renderer</a></font></div>
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif"> 1.1.2 
      <a href="#111">SWT Renderer</a></font></div>
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif"> </font></div>
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif"> 1.1.3 
      <a href="#113">Live Bar and Line Combination Chart</a></font></div>
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.1.4 
      <a href="#114">Dial Chart Viewer</a></font></div>
    <div align="left"> <font size="2" face="Arial, Helvetica, sans-serif">1.1.5 
      <a href="#115">Curve Fitting Chart Viewer</a></font> </div>
    <div align="left"> <font size="2" face="Arial, Helvetica, sans-serif">1.1.6 
      <a href="#116">3D Chart Viewer</a></font> </div>
  </blockquote>
  <div align="left"> 
    <p><font size="2" face="Arial, Helvetica, sans-serif">1.2- Databinding, Grouping 
      and Sorting (org.eclipse.birt.chart.examples.api.data)</font></p>
  </div>
  <blockquote> 
    <div align="left"></div>
    <div align="left"> 
      <div align="left"></div>
    </div>
    <div align="left"> 
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.2.1 
        <a href="#121">Bar Chart with multiple Y series</a></font></div>
    </div>
    <div align="left"> 
      <div align="left"></div>
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.2.2 
        <a href="#122"> Line Chart with multiple Y axis</a></font></div>
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.2.3 
        <a href="#123">Bar Chart with grouping on Y axis</a></font></div>
    </div>
    <div align="left"> 
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.2.4 
        <a href="#124">Pie Chart with min slice (Old)</a></font></div>
    </div>
    <div align="left"> 
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.2.5 
        <a href="#125">Pie Chart with min slice </a></font></div>
    </div>
    <div align="left"> 
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.2.6 
        <a href="#126">Bar Chart with sorting/grouping on X series</a></font></div>
    </div>
  </blockquote>
  <div align="left"> 
    <p><font size="2" face="Arial, Helvetica, sans-serif">1.3- Data Format, Legend/Title/Plot 
      Properties (org.eclipse.birt.chart.examples.api.format)</font></p>
  </div>
  <blockquote> 
    <div align="left"></div>
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.3.1 
      <a href="#131">Chart with formatted X-axis (DateTime) / Y-axis (Number) 
      labels</a></font></div>
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.3.2 
      <a href="#132">Chart with formatted X-series / Y-series values</a></font></div>
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.3.3 
      <a href="#133"> Bar Chart colored by category</a></font></div>
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.3.4 
      <a href="#134">Chart with formatted Legend and Title</a> </font></div>
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.3.5 
      <a href="#135">Pie chart with percentage values</a></font></div>
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.3.6 
      <a href="#136">Chart with customized Plot</a></font></div>
  </blockquote>
  <div align="left"> 
    <p><font size="2" face="Arial, Helvetica, sans-serif">1.4- Interactivity (org.eclipse.birt.chart.examples.api.interactivity)</font></p>
  </div>
  <blockquote> 
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif"> 1.4.1 
      <a href="#141">Bar chart: Mouse_Click + Highlight_Series</a></font></div>
    <div align="left"></div>
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.4.2 
      <a href="#142">Scatter chart: Mouse_Over + Show_Tooltip</a></font></div>
    <div align="left"> 
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.4.3 
        <a href="#143">Pie chart: Mouse_Down + URL_Redirect</a></font></div>
      <div align="left"></div>
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.4.4 
        <a href="#144">Linechart: Mouse_Down + Toggle_Visibility</a></font></div>
    </div>
    <div align="left"></div>
  </blockquote>
  <div align="left"> 
    <p><font size="-1" face="Arial, Helvetica, sans-serif">1.5- Script (org.eclipse.chart.examples.api.script)</font></p>
  </div>
  <blockquote> 
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif"> 1.5.1 
      <a href="#151"> JavaScript</a></font></div>
    <div align="left"></div>
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">1.5.2 
      <a href="#152">Java</a></font></div>
  </blockquote>
  <div align="left"> 
    <p><font size="-1" face="Arial, Helvetica, sans-serif">1.6- Style processor 
      (org.eclipse.chart.examples.api.processor)</font></p>
  </div>
  <blockquote> 
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif"> 1.6.1 
      <a href="#161">StyleProcessor</a></font></div>
  </blockquote>
  <div align="left"> 
    <p><font size="-1" face="Arial, Helvetica, sans-serif">1.7- Preference page 
      (org.eclipse.chart.examples.api.preference)</font></p>
  </div>
  <blockquote> 
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">Please 
      read the Help.htm file within the preference folder.</font></div>
  </blockquote>
  <div align="left"> 
    <p><font face="Arial, Helvetica, sans-serif"><strong><font size="2">2. Sample 
      Reports with Embeded Charts</font></strong></font> <font size="2" face="Arial, Helvetica, sans-serif">(org.eclipse.birt.chart.examples.report)</font></p>
  </div>
  <div align="left"></div>
  <div align="left"> 
    <p><font size="2" face="Arial, Helvetica, sans-serif">2.1 Use DE-API/Chart 
      API to create reports with embedded charts (org.eclipse.birt.chart.examples.report.api)</font></p>
  </div>
  <blockquote> 
    <div align="left"></div>
    <div align="left">
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">2.1.1 
        <a href="#211">Stock Analysis Report with embedded Stock chart and Bar 
        chart</a></font></div>
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif"> </font></div>
    </div>
    <div align="left"> 
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif"> 2.1.2 
        <a href="#212">Sales Report with embedded Pie chart</a></font></div>
    </div>
    <div align="left"> 
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">2.1.3 
        <a href="#213">Meter Chart</a></font></div>
    </div>
    <div align="left"> 
      <div align="left"></div>
    </div>
  </blockquote>
  <div align="left"> 
    <p><font size="2" face="Arial, Helvetica, sans-serif">2.2 Use BIRT designer 
      to create reports with embedded charts (org.eclipse.birt.chart.example.report.design)</font></p>
  </div>
  <blockquote> 
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif"> 2.2.1 
      <a href="#221">Bar chart with JavaScript</a></font></div>
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif"> 2.2.2 
      <a href="#222">Bar chart within Table group header</a></font></div>
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">2.2.3 
      <a href="#223">Dynamic Series Pie Chart</a></font></div>
  </blockquote>
</blockquote>
<div align="center"> 
  <hr>
  <p align="left"><strong><font size="2" face="Arial, Helvetica, sans-serif"><a name="000"></a>Prefix: 
    <u>How to run the examples?</u></font></strong></p>
  <p align="left"><font size="-1" face="Arial, Helvetica, sans-serif"> Please 
    set the following argument when running chart examples (Based on Eclipse 3.2):</font></p>
</div>
<blockquote>
  <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">-DBIRT_HOME=D:\ReportEngine</font></div>
</blockquote>
<div align="left">
<p><font size="-1" face="Arial, Helvetica, sans-serif">ReportEngine is available 
    to download in BIRT download page. </font></p>
  <p><font size="-1" face="Arial, Helvetica, sans-serif">Note: please run the SWT examples 
    as SWT applications. SWT chart examples contains the following statement: 
    idr = ps.getDevice( &quot;dv.SWT&quot; ); in their constructor.</font></p>
</div>
  

<div align="center">
  <hr>
  <p align="left"><font size="2" face="Arial, Helvetica, sans-serif"><strong><u><a name="111"></a>1.1.1 
    &amp; 1.1.2 Swing / SWT Renderers</u></strong></font></p>
  <p align="left"><font size="2" face="Arial, Helvetica, sans-serif">Use Swing 
    render and SWT render to present the various types of charts (2D+2D with depth) 
    respectively:</font></p>
</div>
<ul>
  <li> 
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif"> Bar 
      chart</font></div>
  </li>
  <li><font size="2" face="Arial, Helvetica, sans-serif">Multiple series bar chart</font></li>
  <li> 
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif"> Pie 
      chart</font></div>
  </li>
  <li><font size="2" face="Arial, Helvetica, sans-serif">Multiple series pie chart</font></li>
  <li> 
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif"> Line 
      chart</font></div>
  </li>
  <li><font size="2" face="Arial, Helvetica, sans-serif">Bar and line combination 
    chart </font></li>
  <li> 
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif"> Scatter 
      chart</font></div>
  </li>
  <li> 
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif"> Stock 
      chart</font></div>
  </li>
  <li><font size="2" face="Arial, Helvetica, sans-serif">Area chart</font></li>
</ul>
<div align="center"> 
  <p align="left"><font size="2" face="Arial, Helvetica, sans-serif"> The renderers 
    also provide &quot;Transposed&quot;, &quot;Percent&quot; and &quot;Logarithmic&quot; 
    attributes for the charts mentioned above. </font></p>
  <p></p>
  <p align="left"><font size="2" face="Arial, Helvetica, sans-serif"><a name="113"></a><strong><u>1.1.3 
    Live Bar and Line Combination Chart</u></strong></font></p>
  <p align="left"><font size="2" face="Arial, Helvetica, sans-serif">The example 
    shows how to create a live chart. It contains a bar chart and a line chart. 
    They share the same X-Axis, and the chart graphics is keeping changing according 
    to the change of X-Axis. The example defines a background thread (extends 
    TimerTask) that scrolls/refreshes the chart (offscreeen).</font></p>
  <p></p>
  <p align="left"><font size="2" face="Arial, Helvetica, sans-serif"><a name="114"></a><strong><u>1.1.4 
    Dial Chart Viewer</u></strong></font></p>
  <p align="left"><font size="2" face="Arial, Helvetica, sans-serif">The example 
    shows 4 types of dial / meter charts. Meter charts desplays the current value 
    of a certain measurement. The value is indicated by a pointer and the scale 
    of the meter dial. The background of the meter can be divided into regions. 
    </font></p>
</div>
<blockquote> 
  <div align="left"> <font size="-1" face="Arial, Helvetica, sans-serif">Single 
    Dial, Multi Regions:</font></div>
  <blockquote> 
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif"> DialSeries 
      seDial = (DialSeries) DialSeriesImpl.create();</font></div>
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">DialRegion 
      dregion1 = DialRegionImpl.create();</font></div>
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">seDial.getDial().getDialRegions().add(dregion1);</font></div>
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">....</font></div>
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">seDial.getDial().getDialRegions().add(dregion2); 
      </font></div>
  </blockquote>
  <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">Multi 
    Dials, Multi Regions:</font></div>
  <blockquote> 
    <div align="left"> 
      <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">DialSeries 
        seDial1 = (DialSeries) DialSeriesImpl.create();</font></div>
      <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">DialRegion 
        dregion1 = DialRegionImpl.create();</font></div>
      <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">seDial1.getDial().getDialRegions().add(dregion1);</font></div>
      <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">....</font></div>
    </div>
    <div align="left"> 
      <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">seDial1.getDial().getDialRegions().add(dregion2); 
        </font></div>
    </div>
    <div align="left"> 
      <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">...</font></div>
    </div>
    <div align="left"> 
      <div align="left"> 
        <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">DialSeries 
          seDial2 = (DialSeries) DialSeriesImpl.create();</font></div>
        <div align="left"></div>
        <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">seDial2.getDial().getDialRegions().add(dregion1);</font></div>
        <div align="left"></div>
      </div>
    </div>
    <div align="left"> 
      <div align="left"> 
        <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">seDial2.getDial().getDialRegions().add(dregion2); 
          </font></div>
      </div>
    </div>
    <div align="left"> 
      <div align="left"> 
        <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">...</font></div>
      </div>
    </div>
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">dialChart.setDialSuperimposition(true); 
      </font></div>
  </blockquote>
  <div><font size="-1" face="Arial, Helvetica, sans-serif">Single Dial, Single Region</font></div>
  <blockquote> 
    <div><font size="-1" face="Arial, Helvetica, sans-serif">DialSeries seDial 
      = (DialSeries) DialSeriesImpl.create();</font></div>
    <div><font size="-1" face="Arial, Helvetica, sans-serif">DialRegion dregion 
      = DialRegionImpl.create();</font></div>
    <div><font size="-1" face="Arial, Helvetica, sans-serif">seDial.getDial().getDialRegions().add(dregion);</font></div>
  </blockquote>
  <p align="left"><font size="-1" face="Arial, Helvetica, sans-serif">Multi Dials, 
    Single Region</font></p>
  <blockquote>
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">DialSeries 
      seDial1 = (DialSeries) DialSeriesImpl.create();</font></div>
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">DialSeries 
      seDial2 = (DialSeries) DialSeriesImpl.create();</font></div>
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">dialChart.setDialSuperimposition(true);</font></div>
  </blockquote>
</blockquote>
<p align="left"><font size="2" face="Arial, Helvetica, sans-serif"><a name="115"></a><strong><u>1.1.5 
  Curve Fitting Chart Viewer</u></strong></font></p>
<p align="left"><font size="2" face="Arial, Helvetica, sans-serif">Curve Fitting 
  feature will be available for Series of ChartWithAxes, including Bar, Line, 
  Area, Scatter and Stock charts. The curve line shows the general trend of data 
  values.</font></p>
<blockquote> 
  <blockquote>
    <p align="left"><font size="-1" face="Arial, Helvetica, sans-serif">LineSeries ls = 
      (LineSeries) LineSeriesImpl.create( );<br>
      ls.setCurve( true );</font></p>
  </blockquote>
</blockquote>
<p align="left"><font size="2" face="Arial, Helvetica, sans-serif"><a name="116"></a><strong><u>1.1.6 
  3D Chart Viewer</u></strong></font></p>
<p align="left"><font size="2" face="Arial, Helvetica, sans-serif">3D chart is 
  supported by the types of Bar, Line and Area.</font></p>
<blockquote> 
  <blockquote> 
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">ChartWithAxes 
      cwaBar = ChartWithAxesImpl.create( ); cwaBar.setDimension( ChartDimension.THREE_DIMENSIONAL_LITERAL 
      );</font></div>
    <div align="left"> 
      <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">......</font></div>
    </div>
    <div align="left"> 
      <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">Axis 
        zAxis = AxisImpl.create( Axis.ANCILLARY_BASE );<br>
        xAxisPrimary.getAncillaryAxes( ).add( zAxis );</font></div>
    </div>
    <div align="left"> 
      <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">...... 
        </font></div>
    </div>
    <p align="left"><font size="-1" face="Arial, Helvetica, sans-serif">SeriesDefinition 
      sdZ = SeriesDefinitionImpl.create( );<br>
      zAxis.getSeriesDefinitions( ).add( sdZ );</font></p>
    <p><font size="-1" face="Arial, Helvetica, sans-serif"> // Rotate the chart<br>
      cwaBar.setRotation( Rotation3DImpl.create( new Angle3D[]{<br>
      Angle3DImpl.create( -20, 45, 0 )} ) );</font></p>
  </blockquote>
</blockquote>
<hr>
<p align="left"><font size="2" face="Arial, Helvetica, sans-serif"><a name="121"></a><strong><u>1.2.1 
  Bar Chart with multiple Y series</u></strong></font></p>
<p align="left"><font size="2" face="Arial, Helvetica, sans-serif">The example 
  shows a bar chart with 2 Y-series. The 2 groups of datas has the same X-Series 
  value, but different in Y-Series value, which could be acheived in the report 
  designer as follows: Chart Builder -&gt; Data -&gt; Y Axis -&gt; Set: Number 
  of Series Definitions = 2. </font></p>
<blockquote> 
  <blockquote>
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">yAxis.getSeriesDefinitions().add(ySeriesDefinition1); 
      </font></div>
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">yAxis.getSeriesDefinitions().add(ySeriesDefinition2);</font></div>
  </blockquote>
</blockquote>
<div align="center"> 
  <p align="left"><font size="2" face="Arial, Helvetica, sans-serif"><a name="122"></a><strong><u>1.2.2 
    Line Chart with multiple Y axis</u></strong></font></p>
  <p align="left"><font size="2" face="Arial, Helvetica, sans-serif">The example 
    shows a line chart with 2 Y axis. Each axis matches one of Y series, which 
    could be acheived in the report designer as follows: Chart Builder -&gt; Data 
    -&gt; X Axis -&gt; Set: Number of Y Axes = 2. </font></p>
</div>
<blockquote> 
  <blockquote>
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">Axis 
      yAxisPrimary = cwaBar.getPrimaryOrthogonalAxis(xAxisPrimary);</font></div>
    <div align="left"> <font size="-1" face="Arial, Helvetica, sans-serif">yAxisPrimary.getSeriesDefinitions().add(sdY1);</font></div>
    <br>
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">Axis 
      yAxis = AxisImpl.create(Axis.ORTHOGONAL);<br>
      xAxis.getAssociatedAxes( ).add( yAxis );</font></div>
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">yAxis.getSeriesDefinitions().add(sdY2);</font></div>
  </blockquote>
</blockquote>
<blockquote> 
  <blockquote> 
    <div align="left"></div>
  </blockquote>
</blockquote>
<div align="center"> 
  <p align="left"><font size="2" face="Arial, Helvetica, sans-serif"><a name="123"></a><strong><u>1.2.3 
    Bar Chart with grouping on Y axis </u></strong></font></p>
  <p align="left"><font size="2" face="Arial, Helvetica, sans-serif">This example 
    shows how to create a bar chart with mulitple Y series, which could be acheived 
    in the report designer as follows: Chart Builder -&gt; Data -&gt; Y Axis -&gt; 
    Set: Series Grouping Key.</font></p>
</div>
<blockquote> 
  <blockquote>
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">Axis 
      axisBase = (Axis) ( (ChartWithAxes) cm ).getAxes( ).get( 0 ); // X-Axis<br>
      Axis axisOrth = (Axis) axisBase.getAssociatedAxes( ).get( 0 ); //Y-Axis 
      <br>
      SeriesDefinition sdY = (SeriesDefinition) axisOrth.getSeriesDefinitions().get(0); 
      //Y-Series<br>
      <br>
      SeriesDefinition sdGroup = SeriesDefinitionImpl.create();<br>
      Query query = QueryImpl.create(&quot;row[\&quot;Month\&quot;]&quot;);<br>
      sdGroup.setQuery(query);<br>
      <br>
      axisOrth.getSeriesDefinitions().clear(); // Clear the original Y-Series 
      (sdY)<br>
      axisOrth.getSeriesDefinitions().add(0, sdGroup); <br>
      sdGroup.getSeries().add(sdY.getSeries().get(0));</font></div>
  </blockquote>
</blockquote>
<div align="center">
  <p align="left"><font size="2" face="Arial, Helvetica, sans-serif"><a name="124"></a><strong><u>1.2.4 
    Pie Chart with min slice (Old)</u></strong></font></p>
  <p align="left"><font size="2" face="Arial, Helvetica, sans-serif">The pie chart 
    itself does not have the &quot;min slice&quot; grouping feature yet, but the 
    result could be achieved by using a query with a union in the chart dataset. 
    Here is an example of such an SQL Query that groups values by category, and 
    where the minimum slice value is 10:</font></p>
</div>
<blockquote> 
  <blockquote> 
    <div align="left"><font size="2" face="Arial, Helvetica, sans-serif"><br>
      Select Product, sum (Product_sales) as totalSales<br>
      From productTable<br>
      Group by Product<br>
      Having sum(Product_sale)&gt;10<br>
      Union<br>
      Select 'Others' as Product, sum (Product_sales) as totalSales<br>
      From productTable where Product IN ( Select Product From productTable<br>
      Group by Product<br>
      Having sum(Product_sale)&lt;=10)<br>
      Group by 'others'</font></div><br>
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">OdaDataSetHandle 
      dataSet = (OdaDataSetHandle) designHandle.getDataSets().get(0);</font></div>
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">dataSet.setQueryText(query);</font></div>
  </blockquote>
</blockquote>
<div align="center"> 
  <p align="left"><font size="2" face="Arial, Helvetica, sans-serif"><a name="125"></a><strong><u>1.2.5 
    Pie Chart with min slice </u></strong></font></p>
  <p align="left"><br>
    <font size="-1" face="Arial, Helvetica, sans-serif">New Features added into 
    Pie chart:</font><font size="-1" face="Arial, Helvetica, sans-serif"><br>
    1. Pie chart slice can be exploded by setting expression to explosion attribute.<br>
    2. Implement the same function with MinSlice.java. However, it used chart 
    API to generate the aggregated values under the minimum value for a slice.</font></p>
</div>
<blockquote> 
  <blockquote> 
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">//Explosion<br>
      sePie.setExplosion(30);<br>
      sePie.setExplosionExpression(&quot;orthogonalValue&lt;20 ||orthogonalValue&gt;50&quot;);</font></div><br>
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">//Min 
      Slice<br>
      cwoaPie.setMinSlice(10);<br>
      cwoaPie.setMinSlicePercent(false);<br>
      cwoaPie.setMinSliceLabel(&quot;Others&quot;);<br>
      </font> </div>
  </blockquote>
</blockquote>
<div align="center">
  <p align="left"><font size="2" face="Arial, Helvetica, sans-serif"><a name="126"></a><strong><u>1.2.6 
    Bar Chart with sorting/grouping on X Series</u></strong></font></p>
  <p align="left"><font size="2" face="Arial, Helvetica, sans-serif">This example 
    shows how to group multiple data values in X axis, which could be acheived 
    in the report designer as follows: Chart Builder -&gt; Data -&gt; X Series 
    -&gt; Set Dat Sorting / Tick Grouping Enabled. </font></p>
</div>
<blockquote> 
  <blockquote> 
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">SeriesDefinition 
      sdX = (SeriesDefinition) ( (Axis) ( (ChartWithAxes) cm).getAxes( ).get( 
      0 ) ).getSeriesDefinitions( ).get( 0 ); //Get the X-Series from a chart 
      instance</font></div><br>
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">sdX.setSorting(SortOption.ASCENDING_LITERAL); 
      </font><font size="-1" face="Arial, Helvetica, sans-serif"><br>
      sdX.getGrouping().setEnabled(true);<br>
      sdX.getGrouping().setAggregateExpression(&quot;Sum&quot;);<br>
      sdX.getGrouping().setGroupType(DataType.NUMERIC_LITERAL);<br>
      sdX.getGrouping().setGroupingInterval(1);</font></div>
  </blockquote>
</blockquote>
<div align="center"> 
  <hr>
  <div align="left"> 
    <p><font size="2" face="Arial, Helvetica, sans-serif"><a name="131"></a><strong><u>1.3.1 Chart 
      with formatted X-axis (DateTime) / Y-axis (Number) labels</u></strong></font></p>
    <p><font size="2" face="Arial, Helvetica, sans-serif">This example shows how 
      to format the lable of Axes. </font></p>
  </div>
</div>
<blockquote> 
  <blockquote>
    <div align="center">
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">If 
        the type of axis is DATE_TIME, the statement will be axis.setFormatSpecifier(JavaDateFormatSpecifierImpl.create(&quot; 
        &quot;));</font></div>
    </div>
    <div align="center"> 
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">If 
        the type of axis is NUMBER, the statement will be axis.setFormatSpecifier(JavaNumberFormatSpecifierImpl.create(&quot; 
        &quot;));</font></div>
    </div>
  </blockquote>
</blockquote>
<div align="center"> 
  <div align="left"> 
    <p><font size="2" face="Arial, Helvetica, sans-serif"><a name="132"></a><strong><u>1.3.2 Chart 
      with formatted X-series / Y-series values</u></strong></font></p>
    <p><font size="2" face="Arial, Helvetica, sans-serif">The example shows how 
      to format the value of Series. </font></p>
  </div>
</div>
<div align="center">
  <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">If the 
    LegendItemType is SERIES, X series will not display on the screen, then Y 
    series could be formatted as follows: </font></div>
</div>
<blockquote> 
  <blockquote>
    <div align="center">
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">seriesDefinition.setFormatSpecifier(JavaNumberFormatSpecifierImpl.create(&quot; 
        &quot;));</font></div>
    </div>
  </blockquote>
</blockquote>
<div align="center">
  <div align="left">
    <p><font size="2" face="Arial, Helvetica, sans-serif">If the LegendItemType 
      is CATEGORIES, </font></p>
  </div>
</div>
<blockquote> 
  <blockquote>
    <div align="center">
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">X series: 
        seriesDefinition.setFormatSpecifier(JavaDateFormatSpecifierImpl.create(&quot; 
        &quot;));</font></div>
    </div>
    <div align="center"> 
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">Y series: 
        DataPointComponent dpc = DataPointComponentImpl.create( DataPointComponentType.ORTHOGONAL_VALUE_LITERAL, 
        JavaNumberFormatSpecifierImpl.create(&quot;&quot;) );<br>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;barSeries.getDataPoint().getComponents().clear();<br>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;barSeries.getDataPoint().getComponents().add(dpc);</font></div>
    </div>
  </blockquote>
</blockquote>
<div align="center"> 
  <div align="left"> 
    <p><font size="2" face="Arial, Helvetica, sans-serif"><a name="133"></a><strong><u>1.3.3 Bar 
      Chart colored by category</u></strong></font></p>
    <p><font size="2" face="Arial, Helvetica, sans-serif">The example shows how 
      to create a bar chart. Each bar series has different colors.</font></p>
    <p><font size="2" face="Arial, Helvetica, sans-serif">Firstly, the LegendItemType 
      should be set as CATEGORIES, and then set X series: seriesDefinition.getSeriesPalette( 
      ).update(0);</font></p>
    <p><font size="2" face="Arial, Helvetica, sans-serif"><a name="134"></a><strong><u>1.3.4 Chart 
      with formatted Legend and Title</u></strong></font></p>
    <p><font size="2" face="Arial, Helvetica, sans-serif">The example shows how 
      to format chart legend and title. Before setting the attributes of legend 
      and title, you should get the default legend and title for chart model. 
      </font></p>
    <p><font size="2" face="Arial, Helvetica, sans-serif">They could be achieved 
      via the following statements: TitleBlock tb = chart .getTitle(); and Legend 
      lg = chart.getLegend();</font></p>
    <p><font size="2" face="Arial, Helvetica, sans-serif"><a name="135"></a><strong><u>1.3.5 Pie 
      chart with percentage values</u></strong></font></p>
    <p><font size="2" face="Arial, Helvetica, sans-serif">The pie chart could 
      show the percentage values of categories. The result cannot be achieved 
      directly from chart builder. However, it could be made by operating the 
      data set.</font></p>
    <p><font size="2" face="Arial, Helvetica, sans-serif">Firstly, you should 
      use values[i] += (data[i] / TotalValue) * 100 to generate a new data set 
      containing the values we required in the pie chart. Then use the following 
      statements to format the values:</font></p>
  </div>
</div>
<blockquote> 
  <blockquote> 
    <div align="center"> 
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">DataPointComponent 
        dpc = DataPointComponentImpl.create( DataPointComponentType.ORTHOGONAL_VALUE_LITERAL,<br>
        JavaNumberFormatSpecifierImpl.create(&quot;0'%'&quot;) );<br>
        sePie.getDataPoint().getComponents().clear();<br>
        sePie.getDataPoint().getComponents().add(dpc);</font></div>
    </div>
  </blockquote>
</blockquote>
<div align="center"> 
  <div align="left"> 
    <p><font size="2" face="Arial, Helvetica, sans-serif"><a name="136"></a><strong><u>1.3.6 Chart 
      with customized Plot</u></strong></font></p>
    <p><font size="2" face="Arial, Helvetica, sans-serif">The plot could be formatted 
      similar with Title and Legend.</font></p>
    <hr>
    <div align="center"> 
      <div align="left"> 
        <div align="left"> 
          <div align="center"> 
            <div align="left"> 
              <p><font size="2" face="Arial, Helvetica, sans-serif"><a name="141"></a>Interactivity 
                examples include 3 parts: Svg, Swt and Swing.</font></p>
              <p><font size="2" face="Arial, Helvetica, sans-serif"><strong><u>1.4.1 
                Bar chart: Mouse_Click + Highlight_Series</u></strong></font></p>
              <div align="left"> 
                <p><font size="2" face="Arial, Helvetica, sans-serif">The example 
                  presents a simple bar chart. When the mouse clicks the legend 
                  of chart, the series will be highlighted. The effect could be 
                  obtained by the following code:</font></p>
              </div>
            </div>
          </div>
          <blockquote> 
            <blockquote> 
              <div align="center"> 
                <div align="left"> 
                  <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">cwaBar.getInteractivity( 
                    ).setLegendBehavior( LegendBehaviorType.HIGHLIGHT_SERIE_LITERAL 
                    );<br>
                    barSeries.getTriggers( ).add( TriggerImpl.create( TriggerCondition.ONCLICK_LITERAL,ActionImpl.create( 
                    ActionType.HIGHLIGHT_LITERAL, SeriesValueImpl.create( String.valueOf( 
                    bs.getSeriesIdentifier( ) ) ) ) ) );</font></div>
                </div>
              </div>
            </blockquote>
          </blockquote>
          <p><font size="2" face="Arial, Helvetica, sans-serif"><a name="142"></a><strong><u>1.4.2 
            Scatter chart: Mouse_Over + Show_Tooltip</u></strong></font></p>
        </div>
        <p><font size="2" face="Arial, Helvetica, sans-serif">The example presents 
          a scatter chart. When the mouse hovers in one of the data pair points, 
          a predefined tooltip message will be displayed. The effect could be 
          obtained by the following code:</font> </p>
      </div>
    </div>
    <blockquote> 
      <blockquote>
        <div align="center">
          <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">scatterSeries.getTriggers().add(TriggerImpl.create(TriggerCondition.ONMOUSEOVER_LITERAL, 
            ActionImpl.create(ActionType.SHOW_TOOLTIP_LITERAL, TooltipValueImpl.create(500, 
            null))));</font></div>
        </div>
      </blockquote>
    </blockquote>
    <p><font size="2" face="Arial, Helvetica, sans-serif"><a name="143"></a><strong><u>1.4.3 Pie 
      chart: Mouse_Down + URL_Redirect</u></strong></font></p>
    <div align="left"> 
      <p><font size="2" face="Arial, Helvetica, sans-serif">The example presents 
        a simple pie chart. When the mouse hovers in one of the pie series, the 
        series will be spotlighted. When the mouse clicks on one of the pie series, 
        a designated URL page will be opened. The effect could be obtained by 
        the following code:</font></p>
    </div>
  </div>
</div>
<blockquote> 
  <blockquote> 
    <div align="center"> 
      <div align="left"> 
        <div align="left"><font size="2" face="Arial, Helvetica, sans-serif">Trigger 
          triger = TriggerImpl.create(TriggerCondition.ONMOUSEDOWN_LITERAL, ActionImpl.create(ActionType.URL_REDIRECT_LITERAL, 
          URLValueImpl.create(&quot;Url&quot;, &quot;&quot;, &quot;&quot;, &quot;&quot;, 
          &quot;&quot;)));<br>
          pieSeries .getTriggers().add(triger);</font></div>
      </div>
    </div>
  </blockquote>
</blockquote>
<div align="center"> 
  <div align="left"> 
    <div align="left"> 
      <div align="center"> 
        <div align="left"> 
          <p><font size="2" face="Arial, Helvetica, sans-serif"><a name="144"></a><strong><u>1.4.4 
            Line chart: Mouse_Down + Toggle_Visibility</u></strong></font></p>
          <div align="left"> 
            <p><font size="2" face="Arial, Helvetica, sans-serif">The example 
              presents a simple line chart. When the mouse clicks on the legend 
              of chart, the series will be hiden. The effect could be obtained 
              by the following code:</font></p>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<blockquote> 
  <blockquote> 
    <div align="center"> 
      <div align="left"> 
        <div align="left"> 
          <div align="center"> 
            <div align="left"> 
              <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">legend.getTriggers( 
                ).add( TriggerImpl.create( TriggerCondition.ONMOUSEDOWN_LITERAL,ActionImpl.create( 
                ActionType.TOGGLE_VISIBILITY_LITERAL, SeriesValueImpl.create( 
                &quot;not-used&quot; ) ) ) );</font></div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </blockquote>
  <div align="center"></div>
</blockquote>
<div align="center"> 
  <div align="left"> 
    <hr>
    <div align="center"> 
      <div align="left"> 
        <div align="left"> 
          <div align="center"> 
            <div align="left"> 
              <p><font size="2" face="Arial, Helvetica, sans-serif"><a name="151"></a><strong><u>1.5.1 
                JavaScript </u></strong></font></p>
              <div align="left"> 
                <p><font size="2" face="Arial, Helvetica, sans-serif">The examples 
                  include all beforeXXX( ) functions. The effect could be obtained 
                  by chartModel.setScript( ):</font></p>
              </div>
            </div>
          </div>
          <blockquote> 
            <blockquote>
              <div align="center">
                <div align="left">
                  <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">ChartWithAxes 
                    cwaBar = ChartWithAxesImpl.create( );<br>
                    cwaBar.setScript( &quot;function beforeDrawSeries(series, 
                    renderer, scriptContext)&quot; <br>
                    + &quot;{importPackage(Packages.org.eclipse.birt.chart.model.component.impl);&quot;<br>
                    + &quot;series.setCurveFitting(CurveFittingImpl.create());}&quot;);</font></div>
                </div>
              </div>
            </blockquote>
          </blockquote>
        </div>
      </div>
    </div>
  </div>
</div>
<div align="center"> 
  <div align="left"> 
    <div align="center"> 
      <div align="left"> 
        <div align="left"> 
          <div align="center"> 
            <div align="left"> 
              <div align="left"> 
                <div align="center"> 
                  <div align="left"> 
                    <p><font size="2" face="Arial, Helvetica, sans-serif"><a name="152"></a><strong><u>1.5.2 
                      Java</u></strong></font></p>
                    <div align="left"> 
                      <p><font size="2" face="Arial, Helvetica, sans-serif">First 
                        a java class (extends ChartEventHandlerAdapter) should 
                        be defined, then import the java class into chartModel.setScript( 
                        ). The effect could be obtained by the following code:</font></p>
                    </div>
                  </div>
                </div>
                <blockquote> 
                  <blockquote> 
                    <div align="center"> 
                      <div align="left"> 
                        <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">ChartWithAxes 
                          cwaBar = ChartWithAxesImpl.create( );<br>
                          cwaBar.setScript( &quot;org.eclipse.birt.chart.examples.api.script.java.LegendScript&quot; 
                          );</font></div>
                      </div>
                    </div>
                  </blockquote>
                  <div align="center"> 
                    <div align="left"> 
                      <div align="left"> 
                        <p><font size="-1" face="Arial, Helvetica, sans-serif">Define class 
                          LegendScript.java:</font></p>
                      </div>
                    </div>
                  </div>
                  <blockquote> 
                    <div align="center"> 
                      <div align="left"> 
                        <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">public 
                          class LegendScript extends ChartEventHandlerAdapter{<br>
                          public void beforeDrawLegendEntry( Label label, IChartScriptContext 
                          icsc ){<br>
                          label.getCaption( ).getColor( ).set( 35, 184, 245 );}}</font></div>
                      </div>
                    </div>
                  </blockquote>
                </blockquote>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<div align="center"> 
  <div align="left"> 
    <blockquote> 
      <div align="center"></div>
    </blockquote>
    <div align="center"> 
      <div align="left"> 
        <hr>
        <div align="center"> 
          <div align="left"> 
            <div align="center"> 
              <div align="left"> 
                <div align="left"> 
                  <div align="center"> 
                    <div align="left"> 
                      <p><font size="2" face="Arial, Helvetica, sans-serif"><a name="161" id="161"></a><strong><u>1.6.1 
                        Style Processor</u></strong></font></p>
                      <div align="left"> 
                        <p><font size="-1" face="Arial, Helvetica, sans-serif">Define the 
                          customized style processor by implementing IStyleProcessor, 
                          and then use the customized style to generate the chart 
                          model:</font></p>
                        </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<div align="center">
  <div align="left">
    <div align="center">
      <div align="left">
        <div align="center">
          <div align="left">
            <div align="center">
              <div align="left">
                <div align="left">
                  <blockquote>
                    <div align="center"> 
                      <div align="left">
                        <div align="center">
                          <div align="left">
                            <div align="center">
                              <div align="left">
                                <div align="center">
                                  <div align="left">
                                    <div align="left">
                                      <div align="center">
                                        <div align="left"> <font size="-1" face="Arial, Helvetica, sans-serif">Generator.instance( 
                                          ).build( idr.getDisplayServer( ), cm, 
                                          bo, null, null, StyleProcessor.instance( 
                                          ) );</font></div>
                                      </div>
                                    </div>
                                  </div>
                                </div>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div align="center"> 
                      <div align="left"> 
                        <div align="left"> </div>
                      </div>
                    </div>
                  </blockquote>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<div align="center">
  <div align="left">
    <div align="center">
      <div align="left">
        <div align="center">
          <div align="left">
            <div align="center">
              <div align="left">
                <div align="left">
                  <div align="center">
                    <div align="left">
                      <div align="left">
                        <hr>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<div align="center">
  <div align="left">
    <p><font size="2" face="Arial, Helvetica, sans-serif"><a name="211"></a><strong><u>2.1.1 
      Stock Analysis Report with embedded Stock chart</u></strong></font><u><strong><font size="2"> 
      </font></strong></u></p>
    <font size="2"> 
    <p><font face="Arial, Helvetica, sans-serif">The report presents a stock anaylsis 
      within 8 days. </font><font size="2" face="Arial, Helvetica, sans-serif">After 
      running the class, the output SalesReport.rptdesign file is stored in &quot;output&quot; 
      file folder in the first-level subdirectory of the plugin.</font></p>
    </font> </div>
</div>
<div align="center"> 
  <div align="left"><strong><font size="-1" face="Arial, Helvetica, sans-serif">ScriptDataSet 
    column</font></strong><font size="-1" face="Arial, Helvetica, sans-serif">:</font></div>
</div>
<blockquote> 
  <blockquote> 
    <div align="center"> 
      <div align="left"></div>
    </div>
  </blockquote>
  <div align="center"> 
    <div align="left">
      <p><font size="-1" face="Arial, Helvetica, sans-serif">ComputedColumn cc 
        = StructureFactory.createComputedColumn();<br>
        ......Set Property: ColumnName/Expression/DataType......</font></p>
      <p><font size="-1" face="Arial, Helvetica, sans-serif">cc.setExpression( 
        &quot;row[\&quot;XXX\&quot;]&quot; );</font></p>
    </div>
  </div>
  <div align="center"> 
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">PropertyHandle 
      columnSet = dataSetHandle.getPropertyHandle(ScriptDataSetHandle.COMPUTED_COLUMNS_PROP);<br>
      columnSet.addItem(cc);</font></div>
  </div>
  <div align="center"> 
    <div align="left"> 
      <div align="center"> 
        <div align="left"></div>
      </div>
    </div>
  </div>
  <div align="center"> 
    <div align="left"> 
      <div align="center"> 
        <div align="left"></div>
      </div>
      <div align="center"></div>
    </div>
  </div>
  <div align="center"></div>
</blockquote>
<div align="center"> 
  <div align="left"> 
    <p><strong><font size="-1" face="Arial, Helvetica, sans-serif">ExtendedItemHandle:</font></strong></p>
  </div>
</div>
<blockquote> 
  <div align="center">
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">PropertyHandle computedSet = extendedItemHandle.getColumnBindings( 
      );</font></div>
  </div>
  <div align="center"> 
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">cc.setExpression(&quot;dataSetRow[\&quot;XXX\&quot;]&quot; 
      );</font></div>
  </div>
  <div align="center"> 
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">columnSet.addItem(cc);</font></div>
  </div>
</blockquote>
<div align="center">
  <div align="left">
    <p><font size="-1" face="Arial, Helvetica, sans-serif"><strong>StockChart</strong>:</font></p>
  </div>
</div>
<blockquote> 
  <div align="center"> 
    <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">Query 
      query1 = QueryImpl.create(&quot;row[\&quot;High\&quot;]&quot;);<br>
      Query query2 = QueryImpl.create(&quot;row[\&quot;Low\&quot;]&quot;);<br>
      Query query3 = QueryImpl.create(&quot;row[\&quot;Open\&quot;]&quot;);<br>
      Query query4 = QueryImpl.create(&quot;row[\&quot;Close\&quot;]&quot;);<br>
      ArrayList list = new ArrayList();<br>
      list.add(query1);<br>
      list.add(query2);<br>
      list.add(query3);<br>
      list.add(query4);<br>
      stockChart.getDataDefinition().addAll(list);</font></div>
  </div>
</blockquote>
<div align="center">
  <div align="left">
    <div align="left"> </div>
    <div align="left"> 
      <p><a name="212"></a><u><strong><font size="2" face="Arial, Helvetica, sans-serif"> 2.1.2 
        Sales Report with embedded Pie chart and Bar chart</font></strong></u></p>
      <p><font size="2" face="Arial, Helvetica, sans-serif">The report presents 
        a sales report of 3 brands. The first grid in the top conotains 3 logos 
        for these companys. The following grid contains a grouped table in the 
        left cell and a pie chart in the right cell. After running the class, 
        the output SalesReport.rptdesign file is stored in &quot;output&quot; 
        file folder in the first-level subdirectory of the plugin.</font></p>
    </div>
  </div>
</div>
<blockquote> 
  <div align="center"> 
    <div align="left"> 
      <div align="left"><font size="2" face="Arial, Helvetica, sans-serif"><strong>Dynamic 
        Series Pie Chart</strong>: </font></div>
    </div>
  </div>
  <blockquote> 
    <div align="center"> 
      <div align="left"> 
        <div align="left"> 
          <p><font size="-1" face="Arial, Helvetica, sans-serif">Gradient backgroup: 
            </font></p>
        </div>
      </div>
    </div>
    <div align="center"> 
      <div align="left"> 
        <div align="left"> 
          <p><font size="-1" face="Arial, Helvetica, sans-serif">cwoaPie.getBlock().setBackground(GradientImpl.create(ColorDefinitionImpl.create(204, 
            254, 204), ColorDefinitionImpl.create(254, 226, 240), -35, false)); 
            <br>
            cwoaPie.getPlot().getClientArea().setBackground(ColorDefinitionImpl.TRANSPARENT());<br>
            cwoaPie.getLegend().setBackground(ColorDefinitionImpl.TRANSPARENT());<br>
            cwoaPie.getLegend().getClientArea().setBackground(ColorDefinitionImpl.TRANSPARENT());</font></p>
        </div>
      </div>
    </div>
    <div align="center"> 
      <div align="left"> 
        <div align="left"> 
          <p><font size="-1" face="Arial, Helvetica, sans-serif">Series:</font></p>
        </div>
      </div>
    </div>
    <div align="center"> 
      <div align="left"> 
        <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">withoutAxesChart.getSeriesDefinitions().add(series); 
          //series: Base Series</font></div>
      </div>
    </div>
    <div align="center"> 
      <div align="left"> 
        <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">series.getSeriesDefinitions().add(seGroup); 
          //seGroup: Series Group Key<br>
          seGroup.getSeries().add(ps); //ps: Orthogonal Series</font></div>
      </div>
    </div>
    <div align="center"> 
      <div align="left"> 
        <div align="left"> </div>
      </div>
    </div>
  </blockquote>
  <div align="center"> 
    <div align="left"> 
      <div align="left"> 
        <p><font size="2" face="Arial, Helvetica, sans-serif"><strong>EmbeddedImage</strong>:</font></p>
      </div>
    </div>
  </div>
  <div align="center"> 
    <div align="left"> 
      <div align="left"></div>
    </div>
  </div>
  <blockquote> 
    <div align="center"> 
      <div align="left"> 
        <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">EmbeddedImage 
          image = StructureFactory.createEmbeddedImage( ); //Create a new embedded 
          image</font></div>
      </div>
    </div>
    <div align="center"> 
      <div align="left"> 
        <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">......Set 
          Type/Data/Name for the embedded image......</font></div>
      </div>
    </div>
    <div align="center"> 
      <div align="left"> 
        <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">reportDesignHandle.addImage( 
          image ); //Add EmbeddedImage into the report</font></div>
      </div>
    </div>
    <div align="center"> 
      <div align="left"> 
        <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif"><br>
          ImageHandle imageHandle = elementFactory.newImage(&quot;imageHandle&quot;);</font></div>
      </div>
    </div>
    <div align="center"> 
      <div align="left"> 
        <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">......Set 
          Source/ImageName for the image handle......</font></div>
      </div>
    </div>
  </blockquote>
  <div align="center"> 
    <div align="left"> 
      <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif"><strong>TableGroup</strong>:</font></div>
    </div>
  </div>
  <blockquote> 
    <div align="center"> 
      <div align="left"> 
        <div align="left"> 
          <p><font size="-1" face="Arial, Helvetica, sans-serif">TableGroupHandle 
            group = elementFactory.newTableGroup(); //Create a table group<br>
            group.setKeyExpr(&quot;&quot;); //Set the group key<br>
            table.getGroups().add(group);</font></p>
        </div>
      </div>
    </div>
    <div align="center"> 
      <div align="left"> 
        <div align="left"> 
          <p><font size="-1" face="Arial, Helvetica, sans-serif">RowHandle groupHeader= 
            elementFactory.newTableRow(3); //Create table header / footer<br>
            group.getHeader().add(groupHeader);</font></p>
          <div align="center"> 
            <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">PropertyHandle 
              computedSet = table.getColumnBindings( ); //Data column binding</font></div>
          </div>
          <div align="center"> 
            <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">cc.setName(&quot;XXX&quot; 
              );</font></div>
          </div>
          <div align="center"> 
            <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">columnSet.addItem(cc);</font></div>
          </div>
          <p><font size="-1" face="Arial, Helvetica, sans-serif">data.setResultSetColumn( 
            cc.getName( ) ); //Set value to table data</font></p>
        </div>
      </div>
    </div>
  </blockquote>
</blockquote>
<div align="center"> 
  <div align="left"> 
    <div align="center"> 
      <div align="left"> 
        <div align="center"> 
          <div align="left"> 
            <div align="center"> 
              <div align="left"> 
                <div align="center"> 
                  <div align="left"> 
                    <div align="left"> 
                      <div align="center"> 
                        <div align="left"> 
                          <div align="left"></div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div align="center"> 
      <div align="left"> 
        <p><font size="2" face="Arial, Helvetica, sans-serif"><a name="213" id="213"></a><strong><u>2.1.3 
          Meter Chart</u></strong></font></p>
        <p><font size="2" face="Arial, Helvetica, sans-serif">The report presents 
          a report with a meter chart. After running the class, the output SalesReport.rptdesign 
          file is stored in &quot;output&quot; file folder in the first-level 
          subdirectory of the plugin.</font></p>
      </div>
    </div>
  </div>
</div>
<blockquote> 
  <blockquote>
    <div align="center">
      <div align="left">
        <div align="center">
          <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">Series seCategory 
            = SeriesImpl.create( );<br>
            </font></div>
        </div>
      </div>
    </div>
    <div align="center"> 
      <div align="left"> 
        <div align="center"> 
          <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif"> SeriesDefinition 
            series = SeriesDefinitionImpl.create( );</font></div>
        </div>
      </div>
    </div>
    <div align="center"> 
      <div align="left"> 
        <div align="center"> 
          <div align="left"> 
            <p><font size="-1" face="Arial, Helvetica, sans-serif">series.getSeries( ).add( 
              seCategory );<br>
              dChart.getSeriesDefinitions( ).add( series ); </font></p>
          </div>
        </div>
      </div>
    </div>
    <div align="center"> 
      <div align="left"> 
        <div align="center"> 
          <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif">DialSeries 
            seDial = (DialSeries) DialSeriesImpl.create( );</font></div>
        </div>
      </div>
    </div>
    <div align="center"> 
      <div align="left"> 
        <div align="center"> 
          <div align="left"><font size="-1" face="Arial, Helvetica, sans-serif"> SeriesDefinition 
            seGroup = SeriesDefinitionImpl.create( );<br>
            <br>
            series.getSeriesDefinitions( ).add( seGroup );<br>
            seGroup.getSeries( ).add( seDial );</font></div>
        </div>
      </div>
    </div>
  </blockquote>
</blockquote>
<div align="center">
  <div align="left">
    <blockquote> 
      <div align="center"> 
        <div align="left"> 
          <p>&nbsp;</p>
        </div>
      </div>
    </blockquote>
    <hr>
    <p align="left"><font size="2" face="Arial, Helvetica, sans-serif"><a name="221"></a><strong><u>2.2.1 
      Bar chart with JavaScript</u></strong></font></p>
    <p align="left"><font size="2" face="Arial, Helvetica, sans-serif">DataSource: 
      Script data source</font></p>
    <p align="left"><font size="2" face="Arial, Helvetica, sans-serif">The chart 
      presents computer sale balance based on the hardware components. The scripts 
      have been added in the Chart builder -&gt; Scripts, it works on setting 
      the runtime color for the series with value &lt; 0.</font></p>
    <div align="left"> 
      <p><a name="222"></a><u><strong><font size="2" face="Arial, Helvetica, sans-serif">2.2.2 
        Bar chart within Table group header</font></strong></u></p>
      <p><font size="2" face="Arial, Helvetica, sans-serif">DataSource: Classic 
        Model Inc. sample database</font></p>
      <p><font size="2" face="Arial, Helvetica, sans-serif">The report contains 
        a table with 2 groups to present the product order situation for a model 
        manufactory. The outer table group is grouped on &quot;Product Line&quot;, 
        while the inner one is grouped on &quot;Product Code&quot;. A bar chart 
        is inserted in the header of outer group, which shows the order of different 
        products in the same product line. The product line information is passed 
        from the table group to the chart via a parameter row[0][&quot;ProductLine&quot;].</font></p>
    </div>
    <p align="left"><font size="2" face="Arial, Helvetica, sans-serif"><a name="223"></a><strong><u>2.2.3 
      Dynamic Series Pie Chart</u></strong></font></p>
    <p align="left"><font size="2" face="Arial, Helvetica, sans-serif">Data Source: 
      Script data source</font></p>
    <p align="left"><font size="2" face="Arial, Helvetica, sans-serif">The example 
      shows how to create a dynamic chart. In a Pie chart, set the value of Orthogonal 
      Series Definitions as an array of values. The single chart will expand to 
      a series of charts when clicking preview tab.</font></p>
    <p><br>
    </p>
    <p><font size="2" face="Arial, Helvetica, sans-serif"><strong><br>
      </strong></font> </p>
  </div>
  <p align="left"><br>
  </p>
  <p align="left"><br>
  </p>
  <p align="left"><font size="2"><br>
    </font><font size="1"> </font> </p>
  <p></p>
  <p align="left"><strong> </strong></p>
</div>

See more files for this project here

BIRT

BIRT is an open source, Eclipse-based reporting system that integrates with your application to produce compelling reports for both web and PDF.

Project homepage: http://www.eclipse.org/birt/phoenix/
Programming language(s): Java,XML
License: gpl2

  META-INF/
    MANIFEST.MF
  icons/
    obj16/
      areacharticon.gif
      backward_nav.gif
      backward_nav_disabled.gif
      barcharticon.gif
      bubblecharticon.gif
      chartbuilder.gif
      chartpreview.gif
      chartselector.gif
      delete_edit.gif
      differencecharticon.gif
      expressionbuilder.gif
      fnt_style_Sthrough.gif
      fnt_style_bold.gif
      fnt_style_italic.gif
      fnt_style_underline.gif
      formatbuilder.gif
      forward_nav.gif
      forward_nav_disabled.gif
      ganttcharticon.gif
      linecharticon.gif
      marker_icon.gif
      metercharticon.gif
      piecharticon.gif
      ra_bottomleft.gif
      ra_bottomright.gif
      ra_leftdown.gif
      ra_leftup.gif
      ra_rightdown.gif
      ra_rightup.gif
      ra_topleft.gif
      ra_topright.gif
      rulebuilder.gif
      scattercharticon.gif
      stockcharticon.gif
    obj28/
      alignmentbottomcenter.gif
      alignmentbottomleft.gif
      alignmentbottomright.gif
      alignmentcenter.gif
      alignmentcenterleft.gif
      alignmentcenterright.gif
      alignmenttopcenter.gif
      alignmenttopleft.gif
      alignmenttopright.gif
    wizban/
      bubblechartimage.gif
      chartwatermark.gif
      chartwizardtaskbar.gif
      differencechartimage.gif
      ganttchartimage.gif
      horizontalbubblechartimage.gif
      horizontaldifferencechartimage.gif
      horizontalganttchartimage.gif
      horizontalpercentstackedareachartimage.gif
      horizontalpercentstackedareachartwithdepthimage.gif
      horizontalpercentstackedbarchartimage.gif
      horizontalpercentstackedbarchartwithdepthimage.gif
      horizontalpercentstackedlinechartimage.gif
      horizontalpercentstackedlinechartwithdepthimage.gif
      horizontalscatterchartimage.gif
      horizontalsidebysideareachart3dimage.gif
      horizontalsidebysideareachartimage.gif
      horizontalsidebysideareachartwithdepthimage.gif
      horizontalsidebysidebarchart3dimage.gif
      horizontalsidebysidebarchartimage.gif
      horizontalsidebysidebarchartwithdepthimage.gif
      horizontalsidebysidelinecha.gif
      horizontalsidebysidelinechart3dimage.gif
      horizontalsidebysidelinechartimage.gif
      horizontalsidebysidelinechartwithdepthimage.gif
      horizontalstackedareachartimage.gif
      horizontalstackedareachartwithdepthimage.gif
      horizontalstackedbarchartimage.gif
      horizontalstackedbarchartwithdepthimage.gif
      horizontalstackedlinechartimage.gif
      horizontalstackedlinechartwithdepthimage.gif
      horizontalstockchartbarstickimage.gif
      horizontalstockchartimage.gif
      meterchartimage.gif
      meterchartsuperimposedimage.gif
      percentstackedareachartimage.gif
      percentstackedareachartwithdepthimage.gif
      percentstackedbarchartimage.gif
      percentstackedbarchartwithdepthimage.gif
      percentstackedlinechartimage.gif
      percentstackedlinechartwithdepthimage.gif
      piechartimage.gif
      piechartwithdepthimage.gif
      scatterchartimage.gif
      sidebysideareachart3dimage.gif
      sidebysideareachartimage.gif
      sidebysideareachartwithdepthimage.gif
      sidebysidebarchart3dimage.gif
      sidebysidebarchartimage.gif
      sidebysidebarchartwithdepthimage.gif
      sidebysidelinechart3dimage.gif
      sidebysidelinechartimage.gif
      sidebysidelinechartwithdepthimage.gif
      stackedareachartimage.gif
      stackedareachartwithdepthimage.gif
      stackedbarchartimage.gif
      stackedbarchartwithdepthimage.gif
      stackedlinechartimage.gif
      stackedlinechartwithdepthimage.gif
      stockchartbarstickimage.gif
      stockchartimage.gif
  src/
    org/
  .classpath
  .project
  about.html
  build.properties
  plugin.xml
  readme.html