Angular PieChart - Array Only
To bind the PieChart to an array, pass this array to the dataSource property. The array should contain objects.
JavaScript
- var fruits = [
- { fruit: 'Apples', count: 10 },
- { fruit: 'Oranges', count: 12 },
- { fruit: 'Lemons', count: 15 },
- { fruit: 'Pears', count: 20 },
- { fruit: 'Pineapples', count: 3 }
- ];
- $(function () {
- $("#pieChartContainer").dxPieChart({
- dataSource: fruits,
- series: {
- // See details in the "Bind Series to Data" topic
- argumentField: 'fruit',
- valueField: 'count'
- }
- });
- });
If objects in the array need to be processed (sorted, filtered, etc.), you can create a Query. For example, in the following code, a Query sorts objects in the fruits
array by the count
field in descending order.
JavaScript
- var fruits = [
- { fruit: 'Apples', count: 10 },
- { fruit: 'Oranges', count: 12 },
- { fruit: 'Lemons', count: 15 },
- { fruit: 'Pears', count: 20 },
- { fruit: 'Pineapples', count: 3 }
- ];
- $(function () {
- $("#pieChartContainer").dxPieChart({
- dataSource: DevExpress.data.query(fruits).sortBy("count", true).toArray(),
- series: {
- argumentField: 'fruit',
- valueField: 'count'
- }
- });
- });
See Also
Feel free to share topic-related thoughts here.
If you have technical questions, please create a support ticket in the DevExpress Support Center.
Thank you for the feedback!
If you have technical questions, please create a support ticket in the DevExpress Support Center.