Area Chart using same Datasource as Grid, display weekly aggregate.

[Chad]

I'm new to Kendo UI and Kendo Data Viz so bear with me :D

I have a datasource in my javascript file:

    var _detailDataSource = new kendo.data.DataSource({
        transport: {
            read: {
                type: "POST",
                url: "/Admin/GetDetailUsage",
                dataType: "json",
                data: {
                    beginDate: function () {
                        return $('#beginDate').val();
                    },
                    endDate: function () {
                        return $('#endDate').val();
                    }
                }
            }
        },
        schema: {
            model: {
                fields: {
                    RequestId: { type: "number" },
                    RequestDate: { type: "date" },
                    Interface: { type: "string" },
                    ProviderName: { type: "string" },
                    EmployeeId: { type: "string" },
                    EmployeeName: { type: "string" },
                    EmployeeType: { type: "string" },
                    Department: { type: "string" }
                }
            }
        },
        pageSize: 20
    });

I am currently using that datasource for a grid but I also wanted to use it for an area chart on the same page (different tab in the tab control)

So I have setup the chart like this:

function dashboardChart() {
    $("#chart").kendoChart({
        dataSource: _detailDataSource,
        title: {
            text: "Units sold"
        },
        series: [{
            type: "area",
            field: "RequestId",
            aggregate: "count"
        }],
        categoryAxis: {
            baseUnit: "weeks",
            field: "RequestDate"
        }
    });
}

and then I call the chart like so: dashboardChart();

So, can someone tell me what I'm doing wrong? I want to aggregate the data from the datasource by week and display the number of Requests in an area chart.

Thanks,

Chad.

[Iliana Dyankova]

Hi Chad,

I am not quite sure if I understand correctly what the problem in your application is, however in order to achieve the desired result I can suggest using a shared DataSource. Please note that in this case every time an item is edited the dataSource change event will fire which will cause all widgets bound to that dataSource to rebind. You can see this approach in action at the following links:

• jsBin example I prepared for you
• online demo

Let me know if the suggested approach fits your requirements.

Kind regards,
Iliana Nikolova
the Telerik team