Question

我找到了一个链接，解释了当用户点击楔形（http://jsfiddle.net/derickbailey/FXs6b/）时如何爆炸饼图部分，但它不适用于我。据我所知，它似乎没有更新绑定到图表的explodeFiled的数据源字段。单击一个饼图部分时会调用createChart（）函数但它不会爆炸该部分。该示例工作正常，但如果我尝试将其应用于我自己的代码则不行。我还有一个连接到同一数据源的Kendo网格。网格是可编辑的，如果我“检查”爆炸字段以获取记录，则饼图片段会爆炸。我也删除了网格思考可能附加到同一数据源的2个控件导致了问题但是也没有用。任何人都可以看到我的代码中有什么问题吗？您可以在此处查看我的代码示例：http://jsfiddle.net/ihatemash/d5yR7/

我的课程包含要在图表中显示的数据：

public partial class GetTotals_Result
{
    public Nullable<int> Total { get; set; }
    public int PETypeID { get; set; }
    public string Description { get; set; }
    public bool Exploded { get; set; }
}

我的cshtml文件中的代码：

        var mdl = @Html.Raw(Json.Encode(Model));

        var tempcontext = new kendo.data.DataSource(
            { data: mdl });

        function createChart() {
            $("#piechart").kendoChart({
                title: {
                    position: "bottom",
                    text: "Totals Pie Chart"
                },

                dataSource: tempcontext,

                series: [{
                    type: "pie",
                    field: "Total",
                    categoryField: "Description", 
                    explodeField: "Exploded",
                    labels: { visible: true},                        
                }],

                seriesClick: function(e){
                    $( e.sender.dataSource.options.data ).each( function ( i, item ) {
                        if ( item.Description != e.category )
                        {
                            item.Exploded= false;
                        }
                        else
                        {
                            item.Exploded= true;
                        }
                    } );
                    createChart();
                }

            });
        }
        setTimeout(function() {
            // Initialize the chart with a delay to make sure
            // the initial animation is visible
            createChart();

            $("#example").bind("kendo:skinChange", function(e) {
                createChart();
            });
        }, 400);

Answer 1

我相信数据源永远不会更新（你定义了＃34; Hydro＆＃34;展开设置为true）。但是，如果您按照this jsfiddle中的设置设置数据源，则会发生爆炸。我相信如果您选择使用在函数范围之外定义dataContext变量的原始模式，则可能需要手动更新系列单击事件中数据源中的dataItem。

 function createChart() {
                $("#piechart").kendoChart({
                    title: {
                        position: "bottom",
                        text: "Patient Encounter Totals by Encounter Type - Pie"
                    },
                    legend: {
                        position: "bottom",
                        padding: {right: 20, left: 20},
                        border: { width: 1}
                    },
                    dataSource: { data: data },
                    ... 
  }

用户点击时爆炸饼图部分

1 个答案: