stacked-area-series-page.xml

<!-- >> stacked-series -->
<navigation:ExamplePage xmlns:navigation="navigation/example-page" loaded="onPageLoaded" navigatedTo="onNavigatedTo" xmlns:chart="nativescript-ui-chart" xmlns="http://www.nativescript.org/tns.xsd"> 
    <navigation.actionBar>
         <ActionBar>
            <ActionBar.actionItems>
                <ios>
                    <ActionItem text="Options" ios.position="right" tap="{{onOptionsTapped}}" />
                </ios>
                <android>
                    <ActionItem text="Stack" android.position="popup" tap="onStackModeSelected" />
                    <ActionItem text="Stack 100" android.position="popup" tap="onStack100ModeSelected" />
                    <ActionItem text="None" android.position="popup" tap="onNoneStackModeSelected" />
                </android>
            </ActionBar.actionItems>
        </ActionBar>
    </navigation.actionBar>
    <chart:RadCartesianChart id="cartesianChart">
        <chart:RadCartesianChart.series>
            <chart:AreaSeries items="{{ firstSeries }}" stackMode="Stack" categoryProperty="Country" valueProperty="Amount"></chart:AreaSeries>
            <chart:AreaSeries items="{{ secondSeries }}" stackMode="Stack" categoryProperty="Country" valueProperty="Amount"></chart:AreaSeries>
            <chart:AreaSeries items="{{ thirdSeries }}" stackMode="Stack" categoryProperty="Country" valueProperty="Amount"></chart:AreaSeries>
        </chart:RadCartesianChart.series>

        <chart:RadCartesianChart.horizontalAxis>
            <chart:CategoricalAxis/>
        </chart:RadCartesianChart.horizontalAxis>
        <chart:RadCartesianChart.verticalAxis>
            <chart:LinearAxis/>
        </chart:RadCartesianChart.verticalAxis>
    </chart:RadCartesianChart>
</navigation:ExamplePage>
<!-- << stacked-series -->