javascript - 计算绘图 Y 轴标签值

Question

我正在尝试使用 HTML 5 的 canvas 元素在 javascript 中创建一个绘图函数。我遇到的问题是如何计算 Y 轴的标签。

例如，当你看到一个从 4 到 96 的数字数组时，对我来说，大多数逻辑标签的范围是 0 到 100，步长为 10。

给定一个具有更高类别数字的数组，最大值为 2375，我将使用的最大标签为 2500。

现在，你如何计算这些东西？我一直在寻找解决方案，但还没有找到。

在此先感谢，巴特

Answer 1

不幸的是，没有简单的方法可以做你想做的事。如果你知道你想要一定数量的滴答声（例如十个），你总是可以将最大值除以滴答声的数量。问题是你会有非常可怕的刻度标签。例如，对于 2375，您将每 237.5 个单位有一个刻度，而您可能希望每 250 个刻度有一个刻度，这要“更好”得多。获得这些漂亮的圆形刻度值的唯一方法是具有如下逻辑：

if( maxValue < 100 ) {
  tickValue = 10;
else if( maxValue < 500 ) {
  tickValue = 50;
else if( maxValue < 1000 ) {
  tickValue = 100;
else if( maxValue < 1500 ) {
  tickValue = 150;
} // ...etc