剑道图表类别同时执行轴步进和旋转功能

时间:2018-10-24 06:23:11

标签: javascript kendo-ui axis-labels kendo-chart

我正在使用Kendo UI来可视化Chart并遇到面积图标签问题。 以下是我的代码;

  var dataSource = [
      {category: "2018-09-24", value1: 0, value2: 0}
    , {category: "2018-09-25", value1: 0, value2: 0}
    , {category: "2018-09-26", value1: 0, value2: 0}
    , {category: "2018-09-27", value1: 0, value2: 1}
    , {category: "2018-09-28", value1: 0, value2: 8}
    , {category: "2018-09-29", value1: 0, value2: 0}
    , {category: "2018-09-30", value1: 0, value2: 0}
    , {category: "2018-10-01", value1: 0, value2: 0}
    , {category: "2018-10-02", value1: 16, value2: 10}
    , {category: "2018-10-03", value1: 0, value2: 0}
    , {category: "2018-10-04", value1: 0, value2: 0}
    , {category: "2018-10-05", value1: 0, value2: 0}
    , {category: "2018-10-06", value1: 0, value2: 0}
    , {category: "2018-10-07", value1: 0, value2: 0}
    , {category: "2018-10-08", value1: 0, value2: 0}
    , {category: "2018-10-09", value1: 0, value2: 0}
    , {category: "2018-10-10", value1: 0, value2: 0}
    , {category: "2018-10-11", value1: 0, value2: 0}
    , {category: "2018-10-12", value1: 0, value2: 0}
    , {category: "2018-10-13", value1: 0, value2: 0}
    , {category: "2018-10-14", value1: 0, value2: 0}
    , {category: "2018-10-15", value1: 0, value2: 0}
    , {category: "2018-10-16", value1: 0, value2: 0}
    , {category: "2018-10-17", value1: 0, value2: 0}
    , {category: "2018-10-18", value1: 0, value2: 8}
    , {category: "2018-10-19", value1: 0, value2: 8}
    , {category: "2018-10-20", value1: 0, value2: 0}
    , {category: "2018-10-21", value1: 0, value2: 0}
    , {category: "2018-10-22", value1: 22, value2: 17}
    , {category: "2018-10-23", value1: 28, value2: 11}
    , {category: "2018-10-24", value1: 2, value2: 0}];

  $("#chart").kendoChart({
    dataSource: { data: dataSource, datatype: "number" },
    seriesDefaults: { type: "area", stack:true, categoryField: "category", opacity: 0.8},
    series:
        [
        { field: "value1", name: 'Registed' },
        { field: "value2", name: 'Unregisted' }
        ],
    categoryAxis: { field: "category", type: "date", baseUnit: "days",
        labels: {  rotation: "auto", step: 7, format:"d MMMM" }
    },
    valueAxis: { labels: { format: "##,#" } }
  });  

如我的代码所示,我想同时使用categoryAxis步进和旋转功能。

该代码实际上有效,但问题是旋转角度似乎是使用整个标签而不是使用阶梯式标签计算的。 因此,即使仅显示5个标签,标签也会旋转。

有什么办法可以解决此问题?


0 个答案:

没有答案