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