piechart
Prev  Chart Types  Next

Name

piechart — The piechart component allows for the creation of a pie chart using series data.

Synopsis

LZX: piechart
JavaScript: piechart
Type: Class
Access: public
Topic: Charting And Graphing.Chart Types
Declared in: lps/components/charts/piechart/piechart.lzx

Description

The following is a piechart that uses series data.

Example 60. Simple piechart

                    <canvas height="400" width="400">    
                        <dataset name="baseball"
                            src="../data/pie-data.xml"/> 

                        <piechart id="chart1" width="500" height="500"  dataPointsEnabled="true"
                        datalabelEnabled="true" datalabelColumn="y" style="defaultchartstyle">
                            <dataseries datapath="baseball:/records">
                                <datacolumn name="x"  columndatapath="record/@year"
                                    datatype="number"/> 
                                <dataseries label="wins">                
                                    <datacolumn  name="y" columndatapath="record/@wins"
                                        datatype="number"/>
                                </dataseries>  
                                <datacolumn name="tooltip" columndatapath="record">
                                        <method name="processData" args="v">
                                            return  "year: " + v.attributes.year + "  wins: " +
                                                v.attributes.wins;
                                        </method>
                                </datacolumn>                        
                            </dataseries> 

                            <strokestyle name="pieslicestyle" strokeColor="0x000000" strokeWidth="2"
                                strokeType="dotted" />
                            <legend name="legendbox" legendFontsize="14" initstage="late"
                                legendborder="false">
                                <handler name="onitemmouseover" args="item">
                                    var piepiece = parent.plotarea.arrPiePieces[item.identifier];
                                    piepiece.renderInnerWedge();
                                </handler>

                                <handler name="onitemmouseout" args="item">
                                    var piepiece = parent.plotarea.arrPiePieces[item.identifier];
                                    piepiece.renderWedge();
                                </handler>
                            </legend>

                        </piechart>
                    </canvas>

A pie chart represents a chart that is displayed in the 2D polar plane. This class inherits immediately from chart class and can be instantiated directly. (Warning: Of beta quality.)

Superclass Chain

node (LzNode) » view (LzView) » basecomponent » chart » piechart

Known Subclasses

Details

Methods (2)

renderDataLabels()
<method name="renderDataLabels" />
public function renderDataLabels();
Renders the labels that display the values of the data series.
renderPlotArea()
<method name="renderPlotArea" />
public function renderPlotArea();
Renders the plot area which is an instance of the piechartplotarea class. The plot area requires to read a group of two data series, one for the groups that are represented by the pie slices and the second for their values.

LZX Synopsis

<class name="piechart" extends=" chart ">
  <method name=" renderDataLabels " />
  <method name=" renderPlotArea " />
</class>

JavaScript Synopsis

public piechart extends  chart  {
  prototype public function renderDataLabels ();
  prototype public function renderPlotArea ();
}

Copyright © 2002-2007 Laszlo Systems, Inc. All Rights Reserved. Unauthorized use, duplication or distribution is strictly prohibited. This is the proprietary information of Laszlo Systems, Inc. Use is subject to license terms.

Prev  Up  Next
linechart  Home  Common