1

在我的项目中，我有图表和树形视图，而页面加载图表更新无法正常工作意味着在树形视图中只有两个复选框在页面加载中被选中，但图表显示所有字段值。我需要在页面加载时仅在图表中显示复选框选中的字段值， （页面加载后它工作正常）。

这是小提琴：http: //jsfiddle.net/RHh67/64/

我的图表代码： 

$("#myChart").kendoChart({
    theme: $(document).data("kendoSkin") || "default",
    dataSource: {
        data: tmpData2,
        sort: {
            field: "date",
            dir: "asc"
        },
        schema: {
            model: {
                fields: {
                    date: {
                        type: "date"
                    }
                }
            }
        }
    },
    title: {
        text: "My Date-aware Chart"
    },
    legend: {
        position: "bottom"
    },
    seriesDefaults: {
        type: "line",
        labels: {
            visible: true
        },
        missingValues: "gap"
    },
    series: series,
    valueAxis: [{
        name: "A",
        labels: {
            format: "{0}%"
        }
    },
    {
        name: "B",
        labels: {
            format: "{0}D"
        }
    }],
    categoryAxis: {
        type: "Date",
        field: "date",
        axisCrossingValue: [0, 1000]
    }

});
4

1 回答 1

2

定义redrawChart用新系列刷新图表的 a：

function redrawChart() {
    var chart = $("#myChart").data("kendoChart");

    var checkedSeries = [];

    $("#treeview").find(":checked").each(function () {
        var nodeText = $(this).parent().parent().text();

        $.each(series, function (index, series) {
            if (series.field == nodeText) {
                checkedSeries.push(series);
            }
        });
    });

    chart.options.series = checkedSeries;
    chart.refresh();
}

需要调用此函数：

  1. 在你的树变化。
  2. 设置初始可见系列后。

此外，将初始系列的选择移至 JavaScript 代码的末尾。我的意思是，首先初始化treeview，chart然后才初始化初始值。

tree.dataItem(".k-item:nth(2)").set("checked", true);
tree.dataItem(".k-item:nth(3)").set("checked", true);
updateChks();
redrawChart();

完整的运行版本在这里http://jsfiddle.net/OnaBai/RHh67/68/

于 2013-03-15T12:37:07.547 回答