This is a migrated thread and some comments may be shown as answers.

Cannot aggregate remote data

4 Answers 98 Views
Charts
This is a migrated thread and some comments may be shown as answers.
Mike
Top achievements
Rank 1
Mike asked on 29 Dec 2015, 12:04 AM

I cannot aggregated remote data into a pie chart. It works just fine for local data if I use the following html.

<div id="ReportPOC">
    <div class="demo-section k-content wide">
        <div id="chart"></div>
    </div>

    <script type="text/javascript">
            function createChart() {
                var data = [
                    {
                        "Name": "Inbound GoodMail",
                        "MessageCount": 1394,
                        "Date": "2015-10-05"
                    },
                    {
                        "Name": "Outbound GoodMail",
                        "MessageCount": 724,
                        "Date": "2015-10-05"
                    },
                    {
                        "Name": "Outbound GoodMail",
                        "MessageCount": 504,
                        "Date": "2015-10-06"
                    },
                    {
                        "Name": "Inbound GoodMail",
                        "MessageCount": 256,
                        "Date": "2015-10-06"
                    }
                ];
                var dataSourcePie = new kendo.data.DataSource({
                    transport: {
                        read: {
                            url: '@Url.Action("ReportData", "Home")',
                            dataType: "json"
                        }
                    },
                    group: {
                        field: "Name",
                        aggregates: [
                            { field: "MessageCount", aggregate: "sum" }
                        ]
                    }
                });

                dataSourcePie.fetch().then(function () {
                    var pieD = [];
                    var view = dataSourcePie.view();
                    for (var idx = 0; idx < view.length; idx++) {
                        pieD.push({
                            Name: view[idx].value,
                            MessageCount: view[idx].aggregates.MessageCount.sum
                        });
                    }
                    $("#chart").kendoChart({
                        dataSource: pieD,
                        seriesDefaults: {
                            labels: {
                                visible: true,
                                background: "transparent",
                                template: "#= category #: \n #= value#"
                            }
                        },
                        series: [{
                            type: "pie",
                            field: "MessageCount",
                            aggregate: "sum",
                            categoryField: "Name"
                        }],
                    });
                });
            }

            $(document).ready(createChart);
    </script>
</div>

 

The pie chart show 2 sections where Inbound GoodMail is 1650 and Outbound GoodMail is 1228.  If I change my dataSource to make a remote call to an Action in my Controller, the data doesn't aggregate.

                var dataSourcePie = new kendo.data.DataSource({
                    transport: {
                        read: {
                            url: '@Url.Action("ReportData", "Home")',
                            dataType: "json"
                        }
                    },
                    group: {
                        field: "Name",
                        aggregates: [
                            { field: "MessageCount", aggregate: "sum" }
                        ]
                    }
                });

The json returned is the same, but now I get a pie chart where  Inbound GoodMail is 256 and Outbound GoodMail is 504. The view object returned from dataSourcePiew.view() does not have the correct aggregates. What am I doing wrong?

 

4 Answers, 1 is accepted

Sort by
0
Iliana Dyankova
Telerik team
answered on 04 Jan 2016, 12:24 PM
Hi Mike,

Apologies for the delayed reply - we were short on staff due to the Christmas holidays.

There should not be a difference when chart is bound to local / remote data and I was not able to reproduce the issue on my side (dojo). Could you please provide an isolated runnable example which we could test locally - this way I would be able to check what exactly is going wrong and provide concrete recommendations?

Regards,
Iliana Nikolova
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Mike
Top achievements
Rank 1
answered on 04 Jan 2016, 09:37 PM

When I used http://output.jsbin.com/tarawafotu.js as the data source url, it worked, but I still can't get it to work when I get the data from my controller action method. When I looked at GET request in Fiddler, the data returned was identical, so maybe it has to do with the header?

I created the project the standard ASP.NET 5 template with a few additions.

- HomeController.cs has  been changed to return the data from a method called ReportData().

- There is a new view called KendoSupportTicket.cshtml that displays the pie chart.

- _Layout.cshtml has been change to add a new link called Reports that displays the KendoSupportTicket view.

I tried attaching the entire zipped project, but it exceeded the 2MB limit.

 Thanks,

Mike

0
Iliana Dyankova
Telerik team
answered on 06 Jan 2016, 03:43 PM
Hello Mike,

Thank you for the provided files. The issue is caused by the MessageCount field contains strings, while the chart expects numbers (updated dojo with string fields). Please fix the MessageCount values and let me know if this will help.

Regards,
Iliana Nikolova
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Mike
Top achievements
Rank 1
answered on 06 Jan 2016, 05:02 PM
That was it! Thank you Iliana.
Tags
Charts
Asked by
Mike
Top achievements
Rank 1
Answers by
Iliana Dyankova
Telerik team
Mike
Top achievements
Rank 1
Share this question
or