2

我正在尝试在条形图的 x 轴上显示类别标签，但不知道如何执行此操作。这是HTML和JS：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
    <div id="chart"></div>
    <script src="js/thirdParty/jquery.js"></script>
    <script src="js/thirdParty/kendo.all.min.js"></script>
    <script>
        $(function () {
            $("#chart").kendoChart({
                legend: {
                    visible: false
                },
                seriesDefaults: {
                    type: "column"
                },
                series: [{
                    name: "Category A",
                    data: [5]
                }, {
                    name: "Category B",
                    data: [20]
                }, {
                    name: "Category C",
                    data: [10]
                }],
            })
        });
    </script>
</body>
</html>

以下屏幕截图在我试图放置标签的红色框中突出显示：

在此处输入图像描述

任何帮助，将不胜感激。

4

2 回答 2

4

就您而言，您提供了 3 个系列。如果您打算创建具有三个不同 X 绘图点的单个系列，那么正确的方法如下：

$("#chart2").kendoChart({
                legend: {
                    visible: true
                },
                seriesDefaults: {
                    type: "column"
                },
                series: [{
                    data: [5,10,20]
                }],
              categoryAxis: [{
        categories: ["Category A", "Category B","Category C"]
      }]

            });

我所做的是 - 我说过 Xaxis 将有 3 个绘图点，并且该系列包含一个带有 3 个绘图点的数组数据。

这是 JSBin - http://jsbin.com/aroquki/1/edit

希望这可以帮助。

于 2013-08-17T19:16:39.970 回答
2

你看，这个例子将解决你的问题。

JSbin 代码

文档剑道图

于 2013-08-17T14:05:17.050 回答