在雷达 chart.js 中设置最小值、最大值和步数

Question

我正在使用 chartjs.org 2.2.1 并且有一个雷达图，其值在 1..5 之间。我想将最小值设置为 0，将最大值设置为 5，步长为 1。

这似乎在这篇 SO 帖子 中得到了准确的回答。然而，我的图表仍然有一个奇怪的比例，而不是我根据下面的代码定义的比例。

谁能看到我在这里做错了什么？

     var options = {
        responsive: false,
        maintainAspectRatio: true
    };

    var dataLiteracy = {
        labels: [
            @PointLabel("Literacy", 1), @PointLabel("Literacy", 2), @PointLabel("Literacy", 3),
            @PointLabel("Literacy", 4), @PointLabel("Literacy", 5)
        ],
        datasets: [
            {
                label: "Literacy",
                backgroundColor: "rgba(179,181,198,0.2)",
                borderColor: "rgba(179,181,198,1)",
                pointBackgroundColor: "rgba(179,181,198,1)",
                pointBorderColor: "#fff",
                pointHoverBackgroundColor: "#fff",
                pointHoverBorderColor: "rgba(179,181,198,1)",
                data: [
                    @PointValue("Literacy", 1), @PointValue("Literacy", 2), @PointValue("Literacy", 3),
                    @PointValue("Literacy", 4), @PointValue("Literacy", 5)
                ]
            }
        ]
    };

    var ctx = $("#chartLiteracy");
    var myRadarChart = new Chart(ctx,
    {
        type: 'radar',
        data: dataLiteracy,
        options: options,
        scaleOverride: true,
        scaleSteps: 5,
        scaleStepWidth: 1,
        scaleStartValue: 0
    });

原文由 TheEdge 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

你是对的，但前提是你使用的是 Chart.js v1.x 。

刻度选项在 v2.x （您正在使用的那个）中发生了变化。

---

如果要编辑雷达刻度，则需要在图表选项中编辑 ticks 属性：

 var options = {
    scale: {
        ticks: {
            // changes here
        }
    }
};

根据您的需要（从 0 到 5 的比例），您可以：

• 将属性 beginAtZero 设置为 true 并将 max 设置为 5
• 将属性 min 设置为 0 并将 max 设置为 5

你可以 在这里 看到结果。

原文由 tektiv 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

设置值 stepSize

 scale: {
    ticks: {
        beginAtZero: true,
        max: 5,
        min: 0,
        stepSize: 1
    }
}

原文由 Jeyenth 发布，翻译遵循 CC BY-SA 4.0 许可协议