Kendo UI 图表 - 数据绑定后更新数据源

Question

我有一些需要执行的操作 during/after 我的图表数据绑定。

其中一件事是我添加了缺失的类别（月）。我的问题是，如果我将这些缺失值添加到数据源，它会再次触发数据绑定事件。

有更好的方法吗？

@(Html.Kendo().Chart<MyModel>()
    .Name("chart")
    .DataSource(ds => ds.Read(read => read.Action("GetData", "Home")))
    .CategoryAxis(a => a.Date().Categories(c => c.Date))
    .ValueAxis(v => v.Numeric().Min(0).Max(100))
    .Series(series => series.Column(d => d.Value))
    .Events(e => e.DataBound("dataBound"))
)

function dataBound(e) {
    var chart = e.sender;
    var today = new Date(); 
    // Add current month to chart
    chart.dataSource.add({
        CategoryDate: today,
        Value: 0
    });
}

Answer 1

每次DataSource里面的数据被添加、修改或删除DataSource都会触发事件Change，每个有DataSource的widget都会触发事件[=15] =] DataSource 更改后。

因此您的 DataBound 事件被触发两次，而您的图表使用远程服务 Read 其数据，内部有 2 个事件将被触发以实现它。事件 RequestStart 和 RequestEnd 将被调用，因此我建议您在数据源 RequestEnd 事件中添加缺少的类别。

在RequestEnd事件中你可以修改它的响应数据，你可以调试它来查看这个响应的完整结构；通常它会有 Data 属性，这是您需要更改的 属性。

示例代码

@(Html.Kendo().Chart<MyModel>()
    .Name("chart")
    .DataSource(ds => ds.Read(read => read.Action("GetData", "Home"))
                        .Events(evt => evt.RequestEnd("onChartDsRequestEnd")))
    .CategoryAxis(a => a.Date().Categories(c => c.Date))
    .ValueAxis(v => v.Numeric().Min(0).Max(100))
    .Series(series => series.Column(d => d.Value))
    .Events(e => e.DataBound("dataBound"))
)

function onChartDsRequestEnd(e) {
    // data you should modify before its being placed as datasource's data
    var responseData = e.response;
    responseData.push({.......});
}

Datasource RequestEnd Documentation