kendo 条形图读取从不联系服务器(禁用缓存)

kendo bar chart read never contatct server (cache disabled)

当某些外部事件被触发时,我需要手动调用刷新图表数据源:

$(".k-chart").data("kendoChart").dataSource.read();

每次我调用 read 时,都会调用数据源 requestEnd,但是,显然事件处理程序对象上没有可用的响应。

我看不到任何错误,但在 datasource.transport.read.url 中指定的网络服务在第一次请求后从未到达。

图表仅在第一次通过服务器加载数据,这里是配置:

             $scope.chartopts = {
                charArea: {
                    height: 500,
                },
                title: {
                    position: "bottom",
                    text: "A / B"
                },
                legend: {
                    position: "top",
                    visible: true
                },
                chartArea: {
                    background: "transparent"
                },
                seriesDefaults: {
                    labels: {
                        visible: true,
                        background: "transparent",
                        template: "#= category #: (#= value #)",
                        align: "alignColumn"
                    }
                },
                series: [{
                    startAngle: 180,
                    categoryField: 'category',
                    field: 'value',
                    padding: 0
                }],
                dataSource: {
                    transport: {
                        read: {
                            url: wsurl,
                            type: 'POST',
                            data: {id: id},
                            dataType: 'json',
                            cache: false,
                        }
                    }, 
                    requestEnd: function(e){

                        if(e.type == 'read' && e.response){//works only the first time
                            var rsp = [];
                            var a = e.response.a;
                            var b = e.response.b;
                            var tot = a + b;
                            if(tot!=0){
                                var pa = parseFloat(100 * a / tot).toFixed(2);
                                var pb = parseFloat(100 * b / tot).toFixed(2);
                            }
                            else {
                                pa = 0;
                                pb = 0;
                            }
                            rsp = [{
                                category: "A",
                                value: a,
                                color: "#66FF99",
                            },{
                                category: "B",
                                value: b,
                                color: "#FF9900",
                            }];

                            this.data(rsp);
                        }
                    }
                },
                tooltip: {
                    visible: true,
                },
                valueAxis: {
                    majorGridLines: {
                        visible: false
                    },
                    visible: false
                },
                categoryAxis: {
                    majorGridLines: {
                        visible: false
                    },
                    line: {
                        visible: false
                    }
                }
            };

这是标签:

<div kendo-chart k-options='chartopts' ></div>

我也试过在图表上调用刷新方法。屏幕上的小部件已刷新,但数据源保持不变。

解决了在数据源配置对象中定义架构 属性 和 adapting/moving 从 requestEnd 到 schema.parse 方法的所有逻辑。

        dataSource: {
                transport: {
                    read: {
                        url: wsurl,
                        type: 'POST',
                        data: {id: id},
                        dataType: 'json',
                        cache: false,
                    }
                }, 
                schema: {
                    data: 'results',
                    total: 'total',
                    parse: function(data){
                        var rsp = [];
                        var a = data.a;
                        var b = data.b;
                        var tot = a + b;
                        if(tot!=0){
                            var pa = parseFloat(100 * a / tot).toFixed(2);
                            var pb = parseFloat(100 * b / tot).toFixed(2);
                        }
                        else {
                            pa = 0;
                            pb = 0;
                        }
                        rsp = {results: [{
                            category: "A",
                            value: a,
                            color: "#66FF99",
                        },{
                            category: "B",
                            value: b,
                            color: "#FF9900",
                        }], total: 2};

                       return rsp;

                    }
                }
            }

每次我需要运行 datasource.read(),我也刷新图表:

var chart = $(".k-chart").data("kendoChart");
chart.dataSource.read();
chart.refresh();