1

我正在使用 Kendo Data viz 并将 JSON 传递给 .NET MVC 页面来初始化图表：

<div class="k-chart" id="SummaryWeekImportChart"></div>
$("#SummaryWeekImportChart").kendoChart(
        @Html.Raw(Model.KendoLineChartJson));

JSON（重要位）：

"dataSource":{
  "schema":{
     "model":{
        "fields":{
           "TotalValue":{
              "type":"number"
           },
           "SuccessValue":{
              "type":"number"
           },
           "ErrorValue":{
              "type":"number"
           },
           "Date":{
              "type":"date"
           },
           "Category":{
              "type":"string"
           },
           "ToolTip":{
              "editable":false,
              "type":"string"
           }
        }
     }
  },
  "data":[
     {
        "TotalValue":0,
        "SuccessValue":0,
        "ErrorValue":0,
        "Date":"2013-10-18T00:00:00",
        "Category":"18/10/2013",
        "ToolTip":"18/10/2013"
     },
     {
        "TotalValue":0,
        "SuccessValue":0,
        "ErrorValue":0,
        "Date":"2013-10-19T00:00:00",
        "Category":"19/10/2013",
        "ToolTip":"19/10/2013"
     },
     {
        "TotalValue":0,
        "SuccessValue":0,
        "ErrorValue":0,
        "Date":"2013-10-20T00:00:00",
        "Category":"20/10/2013",
        "ToolTip":"20/10/2013"
     },
     {
        "TotalValue":0,
        "SuccessValue":0,
        "ErrorValue":0,
        "Date":"2013-10-21T00:00:00",
        "Category":"21/10/2013",
        "ToolTip":"21/10/2013"
     },
     {
        "TotalValue":1,
        "SuccessValue":0,
        "ErrorValue":1,
        "Date":"2013-10-22T00:00:00",
        "Category":"22/10/2013",
        "ToolTip":"22/10/2013"
     },
     {
        "TotalValue":68,
        "SuccessValue":68,
        "ErrorValue":0,
        "Date":"2013-10-23T00:00:00",
        "Category":"23/10/2013",
        "ToolTip":"23/10/2013"
     },
     {
        "TotalValue":96,
        "SuccessValue":96,
        "ErrorValue":0,
        "Date":"2013-10-24T00:00:00",
        "Category":"24/10/2013",
        "ToolTip":"24/10/2013"
     }
  ]

我使用 javascript 每 x 秒轮询一次服务器：

$.get("/Dash/GetLineChartData", { searchDateString: searchDateForm },
            function (incomingData) {
                console.log("GetLineChartData back...", incomingData);

                // Replace the data in the pie chart with the new data
                var chart = $('#SummaryWeekImportChart').data("kendoChart");
                var currSource = chart.dataSource;
                currSource.data(incomingData.dataSource.data);
                chart.refresh();
            });

加载时的图表 刷新后的图表

数据加载正常，但 x 轴上的标签中断。

有谁知道如何在不弄乱标签的情况下更新折线图的数据？

4

1 回答 1

1

您可以在剑道图表中添加 categoryAxis 属性，例如

categoryAxis: {
                field: "Date",
                labels: {
                    rotation: -65
                },
                majorGridLines: {
                    visible: false
                }
            },
于 2013-11-28T06:13:48.867 回答