计算图表的相对点坐标？

Question

我正在使用canvas元素创建一个简单的 JavaScript 图形库。我真的很厌倦数学，所以我遇到了一个简单的问题。

如果我有一个数字 - 例如 30000 ，我想将其相对于图表的高度（ 400 ）进行绘制。如何计算y的值？

Answer 1

您可能想要计算图表的最大值。比方说，在这种情况下50000.然后，取你的身高并除以最大值（所以400/50000）得到一个比率乘数。您想要绘制的任何数字乘以该比率，并且应该为您提供适合您空间的数字。那是你要的吗？

Answer 2

为此，您需要先找出需要绘制的最大值和最小值。例如，在(x,y)坐标列表中[(1,3),(2,10),(3,0),(4,-10)]，最大值为10，最小值为-10。这为您提供了(max-min = 10-(-10) = ) 20。

的范围

请注意，您现在可以将y值集合转换为[0,max-min]范围内的数字（在本例中为[0,20]）。这里，值0将在图中绘制为0，值20将绘制为400.此外，值20/2将绘制为400/2。因此，20/x的值被绘制为400/x。这意味着现在可以将任何值绘制为400 *值/ 20。

因此，要将给定值n转换为图表上相应的y值，只需将n转换为(n-min)*400/(max-min)。