Added PieChart to the BarChart example.
Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/a8537028 Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/a8537028 Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/a8537028 Branch: refs/heads/VF2JS Commit: a8537028b0cae4da96d7ae5e9acb5e69d2e7d41e Parents: 3c37e61 Author: Peter Ent <p...@apache.org> Authored: Fri Jul 18 14:35:05 2014 -0400 Committer: Erik de Bruin <e...@ixsoftware.nl> Committed: Mon Jul 28 11:28:12 2014 +0200 ---------------------------------------------------------------------- examples/BarChartExample/src/MyInitialView.mxml | 32 +++++++++++++++----- examples/BarChartExample/src/README.txt | 16 +++++++--- 2 files changed, 36 insertions(+), 12 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/a8537028/examples/BarChartExample/src/MyInitialView.mxml ---------------------------------------------------------------------- diff --git a/examples/BarChartExample/src/MyInitialView.mxml b/examples/BarChartExample/src/MyInitialView.mxml index c5f7337..185dfae 100644 --- a/examples/BarChartExample/src/MyInitialView.mxml +++ b/examples/BarChartExample/src/MyInitialView.mxml @@ -21,7 +21,7 @@ limitations under the License. xmlns:basic="library://ns.apache.org/flexjs/basic" xmlns:local="*" xmlns:models="models.*" -> + > <fx:Script> <![CDATA[ @@ -43,20 +43,38 @@ limitations under the License. <basic:BarChartSeries yField="sales" fillColor="0xFF964D"> <basic:itemRenderer> - <fx:Component> - <basic:BoxItemRenderer /> - </fx:Component> + <fx:Component> + <basic:BoxItemRenderer /> + </fx:Component> </basic:itemRenderer> </basic:BarChartSeries> <basic:BarChartSeries yField="detail" fillColor="0x964DFF"> <basic:itemRenderer> - <fx:Component> - <basic:BoxItemRenderer /> - </fx:Component> + <fx:Component> + <basic:BoxItemRenderer /> + </fx:Component> </basic:itemRenderer> </basic:BarChartSeries> </basic:series> </basic:BarChart> + <basic:PieChart id="pieChart" x="20" y="300" width="300" height="300"> + <basic:beads> + <basic:ConstantBinding + sourceID="applicationModel" + sourcePropertyName="productList" + destinationPropertyName="dataProvider" /> + </basic:beads> + <basic:series> + <basic:PieChartSeries dataField="sales"> + <basic:itemRenderer> + <fx:Component> + <basic:WedgeItemRenderer /> + </fx:Component> + </basic:itemRenderer> + </basic:PieChartSeries> + </basic:series> + </basic:PieChart> + </basic:ViewBase> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/a8537028/examples/BarChartExample/src/README.txt ---------------------------------------------------------------------- diff --git a/examples/BarChartExample/src/README.txt b/examples/BarChartExample/src/README.txt index 63330b5..9179bd3 100644 --- a/examples/BarChartExample/src/README.txt +++ b/examples/BarChartExample/src/README.txt @@ -17,9 +17,15 @@ // //////////////////////////////////////////////////////////////////////////////// -This example demonstrates how to construct a BarChart. The example shows a chart -with two BarSeries on the same axis. +This example demonstrates how to construct a BarChart and a PieChart. The BarChart +is composed of two series while the PieChart has one (and only one) series. -The sample uses the BarChart source files found in the project, not in the FlexJS -SDK. This allows you to cross-compile the component to JavaScript and produce an -HTML chart. +At this time, PieChart supports only one series, but BarChart can support several. + +PieChart uses SVG on the HTML/JavaScript side to draw the wedges. This is still +a "to do" item for BarChart, but it should be done. Further charts can follow +the same pattern. + +PieChart uses a special ChartDataGroup (since all charts, so far, are based on +List) that provides an SVG element on the JavaScript side. BarChart can make use +of the same construct and have BoxItemRenderer create an SVG <rect> element.