剑道图y轴标签问题

Posted 2023-05-07

【中文标题】剑道图y轴标签问题

【英文标题】：Kendo chart y axis label problems

【发布时间】：2016-12-03 21:47:34

【问题描述】：

我在使用剑道图表的 y 轴标签时遇到问题。

如果我在那里有很大的值，它会显示得很好，它会适应并显示标签相应地步进：假设值从 0 到 100，标签会自动步进，如 0、20、40、60、80、100。一切都很好.

但对于较低的值，它们会重复，如下所示：

经过一些研究，例如，我尝试将MajorUnit 属性设置为 1，并将其修复为较低的值：

        .ValueAxis(axis => axis.Numeric()
            .Labels(l => l.Format("N0"))
            .MajorGridLines(lines => lines.Visible(true))
            .MajorTicks(lines => lines.Visible(true))
            .MajorUnit(1) // <----------- this one

但是，对于高值，它会为每个单独的标签制作一个标签，从而导致一些重叠：

我无法在 dataBound 上设置 MajorUnit，因为我在图表中有多个系列，一些从 0 到 2，另一些从 0 到 200。

我该如何解决这个问题？

【问题讨论】：

如果您将标签格式化为允许保留一位小数，然后允许图表自动计算步长，该怎么办？

我尝试过类似@ezanker，但没有运气

【参考方案1】：

您必须在 Chart 'dataBound' 事件上动态调整 'categoryAxis.labels.step'

function dataBound(e) 
var chart = $("#chart").data("kendoChart");
if ([*MajorUnitData*].length > 4) 
    chart.options.categoryAxis.labels.step = 10;

else 
    chart.options.categoryAxis.labels.step = 1;
    

参考此链接：http://mikaelkoskinen.net/post/kendoui-dataviz-tips-and-tricks

【讨论】：

是的，当您只有一个系列时，这很好。这样，无论它返回 5 条还是 5000 条记录，您都可以相应地设置步长 (+1)。但我的问题是我有多个系列，具有不同的值范围，所以如果我将步骤设置为适合一个，我将不适合另一个

您可以对所有系列的组合值取最小值和最大值，并调整标签步长。

好吧，如果我的系列的范围是 0 到 3，其他系列的范围是 0 到 200，那么您对步长值有何建议？

在这种情况下，您可以尝试多个 X/Y 轴：docs.telerik.com/kendo-ui/controls/charts/… 和 demos.telerik.com/aspnet-mvc/bar-charts/multiple-axes

感谢您的努力，但我无法更改图表的布局

【参考方案2】：

我会将图表高度设置为与类别轴数成比例

dataBound: function (e) 
                var axis = e.sender.options.categoryAxis;
                $(e.sender.element).css("height", axis.categories.length * 45);
                $(e.sender.element).data("kendoChart").redraw();
              

【讨论】：

我不能改变页面的布局，否则，我会的。感谢您的建议