为莫里斯条形图设置最大轴值或范围步长？答案

【问题标题】：Setting a max axis value or range step for a Morris Bar Chart?为莫里斯条形图设置最大轴值或范围步长？
【发布时间】：2015-08-09 10:37:14
【问题描述】：

我想知道是否可以在条形图上设置最大轴值（例如，我希望数据的最高点位于 y 轴的顶端）？我看到折线图上有 ymin 和 ymax 选项，但我似乎找不到关于条形图的任何信息。

此外，如果有人知道如何将轴车道之间的范围强制为一定量（比如每条线增加 250 倍而不是生成量，这对我来说太高了，我不喜欢），那将会很有帮助。

【问题讨论】：

标签： morris.js

【解决方案1】：

为y 轴设置最大值

实际上，您也可以为条形图设置ymax（即使没有记录）。

Morris.Bar({
  element: 'bar-example',
  data: [
    { y: '2006', a: 100, b: 90 },
    { y: '2007', a: 75,  b: 65 },
    { y: '2008', a: 50,  b: 40 },
    { y: '2009', a: 75,  b: 65 },
    { y: '2010', a: 50,  b: 40 },
    { y: '2011', a: 75,  b: 65 },
    { y: '2012', a: 100, b: 90 }
  ],
  xkey: 'y',
  ymax: 300, // set this value according to your liking
  ykeys: ['a', 'b'],
  labels: ['Series A', 'Series B']
});

并将您的 y 轴设置为此最大值：

为y 轴设置范围值

似乎无法为y 轴设置范围值。该值似乎是根据传递给Morris.Bar 的数据值计算得出的。

【讨论】：

【解决方案2】：

未记录，但您可以通过应用 ymax 来设置最大 y。您可以通过设置 numLines 来操纵范围（也没有记录）。

例如

var chart = new Morris.Bar({
...
    ymin: 0,
    ymax: 7,
    numLines: 8,
...
});

上面定义的图表将显示 0 到 7 之间的值，并为 0 到 7 之间的每个整数显示一条网格线（因此 8 作为参数）

【讨论】：

【解决方案3】：

要更改为 ymax 调用这个

chart.options["ymax"] = 300;

chart 是你的图表变量

【讨论】：

【解决方案4】：

我希望数据的最高点位于 y 轴的顶端

文档非常稀少且令人困惑，但这可以使用仅在 Lines & Area Charts 中记录的 ymin 变量。该变量的默认值似乎是 auto 0 并将其更改为 auto 似乎会产生所需的结果，如下所示。

如何强制轴车道之间的距离为一定量

这在本地似乎是不可能的。但是，您可以使用以下功能破解轴标签。它会将值四舍五入为 250 的倍数但网格线不会是显示的数字。例如。假设网格线位于 570。下面的函数会将标签更改为 500，但该线仍将显示在 570 标记处。

yLabelFormat: function(d) {
    return Math.round(d) - (Math.round(d) % 250);
},

正如其他人所提到的，您可以将ymax 设置为您希望上限的值，但由于您希望最高数据点成为上限，请将ymax 设置为auto。您也可以尝试将numLines 更改为不同的值以获得更好的美感。

【讨论】：