剑道图表刷新数据不变

Question

我使用的是剑道图表，第一次调用工作正常，但是当我调用 refresh_interval 5000 时，图表没有更新。他更新的数据显示在控制台上。 每次都带回旧的结果。当我刷新页面时，我希望图表带来更新的结果。 我做错了什么？

我的代码：

<script th:inline="javascript">
  $(function(){
        var page = 1;
    
    createMonthChart(today, 1);
    
    $(window).resize(function(){
            $("#chart_month").data("kendoChart").refresh();
        });
    
  }); 
  
  function createMonthChart(today, page) {
        var date = today;
        $("#chart_month").kendoChart({
            dataSource: {
                transport: {
                    read: {
                        url: "dashboard/monthProcess.json?date="+date+"&&pageNo="+page
                    }
                }
                
            },
            legend: {
                position: "bottom",
                labels: {
                    margin:5,
                },
             },
            seriesDefaults: {
                type: "column",
                stack: true,
                labels:{
                  visible :true,
                  position:"center",
                  background : "transparent",
                template: "#if (value > 0) {# #: value # #}#"
                }
             },
            series: [{
                field: "success",
                name : "success",
                categoryField: "processName"
            },
            {
                field: "fail",
                name : "fail",
                categoryField: "processName"
                
            }
            ],
            seriesColors: ["#3CB371", "#FF6347"],
        });
      } 
    
</script>
<script th:inline="javascript">
  var refresh_interval = 5000;
  $(function(){
    var timer;
    var select = $("select#resetTimeSelect");
    select.siblings("label").text(select.children("option:selected").text());   //refresh time select
    select.change(function(){
        var select_name = $(this).children("option:selected").text();
        $(this).siblings("label").text(select_name);
        
        window.refresh_interval = $(this).children("option:selected").val();
        
        refresh();
    });
    
    
    window.onbeforeunload = function() {
        clearInterval(window.timer);
    }
    
    var ajaxRunning = false;
  
  refresh();
  
  });
  
  function refresh(){
     if(window.refresh_interval != "stop"){
            window.timer = setInterval(function(){
                loadRobotCount();
                pageNo = pageNo + 1;
                if(pageNo == totalPage){
                    pageNo = 1;
                }
                ChartRefreshMonth(today, pageNo);
            
            }, window.refresh_interval);
         }
  
  }
  
  function ChartRefreshMonth(today, page){
        var date = today;
        $.ajax({
             url: "dashboard/monthProcess.json?date="+date+"&&pageNo="+page,
            type : "GET",
            dataType : "json",
            cache : false,
            contentType : "text/json; charset=UTF-8",
            success : function(data) {
                totalPage = data[0].recordCountPerPage;
                $("#chart_month").data("kendoChart").dataSource.read();
                var chart = $("#chart_month").data("kendoChart");
                chart.refresh();
            },
            error : function(xhr, status, err){
                alert(FailMessage);
            }
        });
    }
  

</script>

Answer 1

在ChartRefreshMonth，这段代码：

$("#chart_month").data("kendoChart").dataSource.read();

使用旧网址调用后端。

您正在调用的结果不会传递到任何地方。

您需要从 2 种方法中选择一种：

1. dataSource 处理后端调用
2. 你处理电话，然后做dataSource.data(result)

两者都可以，但你需要选择一个并做对。