有没有人有 RadPieChart for nativescript + angular 的样本?
Does anyone have a sample for RadPieChart for nativescript + angular?
我正在创建一个必须在我的主页选项卡上显示饼图的跨平台应用程序。我在哪里可以找到完整的示例?
我尝试按照 this tutorial 根据我使用的版本更改它,但不起作用,在我看来第一部分与第二部分不匹配。
这是home.component.html
的一部分
<RadPieChart id="pieChartGiacenze" allowAnimation="true">
<RadPieChart.series>
<DonutSeries
selectionMode="DataPoint"
expandRadius="0.4"
outerRadiusFactor="0.7"
innerRadiusFactor="0.4"
valueProperty="Amount"
legendLabel="Brand"
[items]="pieSource">
</DonutSeries>
</RadPieChart.series>
<RadPieChart.legend>
<RadLegendView position="Right" offsetOrigin="TopRight" width="110" enableSelection="true"></RadLegendView>
</RadPieChart.legend>
</RadPieChart>
这是 home.component.ts
的一部分
public pieSource;
//.....somecode.....
this.pieSource = new ObservableArray();
this.pieSource.push({Brand:"ciao", Amount:50});
this.pieSource.push({Brand:"mondo", Amount:80});
我在家里看不到图表。我哪里错了?
这是示例,在 .html 文件
中
<GridLayout height="500" rows="auto,*">
<Label text="Test Pie Chart" row="0"></Label>
<RadPieChart allowAnimation="true" row="1">
<PieSeries tkPieSeries selectionMode="DataPoint"
expandRadius="0.4" outerRadiusFactor="0.7" [items]="pieSource"
valueProperty="Amount" legendLabel="Brand"></PieSeries>
<RadLegendView tkPieLegend position="Right" offsetOrigin="Bottom"
width="100" enableSelection="true" offsetOrigin="TopRight"></RadLegendView>
</RadPieChart>
</GridLayout>
并在您的 .ts 文件中
pieSource: { Brand: string, Amount: number }[] = [
{ Brand: "Audi", Amount: 10 },
{ Brand: "Mercedes", Amount: 76 },
{ Brand: "Fiat", Amount: 60 },
{ Brand: "BMW", Amount: 24 },
{ Brand: "Crysler", Amount: 40 }
];
这是给你的playground。
我正在创建一个必须在我的主页选项卡上显示饼图的跨平台应用程序。我在哪里可以找到完整的示例?
我尝试按照 this tutorial 根据我使用的版本更改它,但不起作用,在我看来第一部分与第二部分不匹配。
这是home.component.html
的一部分<RadPieChart id="pieChartGiacenze" allowAnimation="true">
<RadPieChart.series>
<DonutSeries
selectionMode="DataPoint"
expandRadius="0.4"
outerRadiusFactor="0.7"
innerRadiusFactor="0.4"
valueProperty="Amount"
legendLabel="Brand"
[items]="pieSource">
</DonutSeries>
</RadPieChart.series>
<RadPieChart.legend>
<RadLegendView position="Right" offsetOrigin="TopRight" width="110" enableSelection="true"></RadLegendView>
</RadPieChart.legend>
</RadPieChart>
这是 home.component.ts
的一部分public pieSource;
//.....somecode.....
this.pieSource = new ObservableArray();
this.pieSource.push({Brand:"ciao", Amount:50});
this.pieSource.push({Brand:"mondo", Amount:80});
我在家里看不到图表。我哪里错了?
这是示例,在 .html 文件
中<GridLayout height="500" rows="auto,*">
<Label text="Test Pie Chart" row="0"></Label>
<RadPieChart allowAnimation="true" row="1">
<PieSeries tkPieSeries selectionMode="DataPoint"
expandRadius="0.4" outerRadiusFactor="0.7" [items]="pieSource"
valueProperty="Amount" legendLabel="Brand"></PieSeries>
<RadLegendView tkPieLegend position="Right" offsetOrigin="Bottom"
width="100" enableSelection="true" offsetOrigin="TopRight"></RadLegendView>
</RadPieChart>
</GridLayout>
并在您的 .ts 文件中
pieSource: { Brand: string, Amount: number }[] = [
{ Brand: "Audi", Amount: 10 },
{ Brand: "Mercedes", Amount: 76 },
{ Brand: "Fiat", Amount: 60 },
{ Brand: "BMW", Amount: 24 },
{ Brand: "Crysler", Amount: 40 }
];
这是给你的playground。