0
Я использую линейную диаграмму кендо в своем приложении, значения/метки оси x перекрываются. Свойство xAxis.labels.step не работает в моем случае, поскольку categoryaxis привязывается к источнику данных, который может содержать разницу дат в днях/месяцев/лет. Как я могу избежать ovelapping?Html Линейная диаграмма Kendo наклейки оси x, перекрывающиеся
Я использовал поворот, чтобы исправить эту проблему, но есть ли другой подход?
Ниже мой код:
<!DOCTYPE html>
<html>
<head>
\t <meta charset="utf-8">
\t <title>Kendo UI Snippet</title>
\t <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1316/styles/kendo.common.min.css">
\t <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1316/styles/kendo.rtl.min.css">
\t <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1316/styles/kendo.default.min.css">
\t <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1316/styles/kendo.dataviz.min.css">
\t <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1316/styles/kendo.dataviz.default.min.css">
\t <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1316/styles/kendo.mobile.all.min.css">
\t <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
\t <script src="http://cdn.kendostatic.com/2014.3.1316/js/kendo.all.min.js"></script>
</head>
<body>
\t <div id="chart"></div>
\t <script>
\t \t var seriesData = [
\t \t \t {
\t \t \t \t year: new Date(Date.parse("12/12/2011")),
\t \t \t \t value: 1
\t \t \t },
\t \t \t {
\t \t \t \t year: new Date(Date.parse("13/12/2012")),
\t \t \t \t value: 3
\t \t \t },
\t \t \t {
\t \t \t \t year: new Date(Date.parse("23/12/2012")),
\t \t \t \t value: 4
\t \t \t }
];
\t \t $("#chart").kendoChart({
\t \t \t categoryAxis: {
\t \t \t \t min: new Date("12/1/2011"),
\t \t \t \t max: new Date("23/12/2012"),
\t \t \t \t baseUnit: "days",
\t \t \t \t type: "date",
\t \t \t \t field: "year",
\t \t \t \t labels: {
\t \t \t \t \t dateFormats: {
\t \t \t \t \t \t days: "MM/dd/yy"
\t \t \t \t \t },
\t \t \t \t }
\t \t \t },
\t \t \t chartArea: {
\t \t \t \t width: 300,
\t \t \t \t height: 200
\t \t \t },
\t \t \t series: [
\t \t \t \t {
\t \t \t \t \t field: "value",
\t \t \t \t \t type: "line"
\t \t \t \t }
],
\t \t \t dataSource: {
\t \t \t \t data: seriesData
\t \t \t }
\t \t });
\t </script>
</body>
</html>