Javascript bmi计算器指针位置

Javascript bmi calculator pointer position

我正在构建一个 BMI(体重指数)计算器,一切正常,但现在我想添加一个图像,上面有一个指示 BMI 结果的指针。

我的问题是我不知道要使用什么公式来计算指针将落在何处以及将指针正确定位在图像上。

因此,如果结果是 21.5,我希望指针位于图像上 21.5 所在的位置。

请查看所附图片以了解我想要实现的目标

谢谢

看到我自己对 javascript 很陌生,我不太确定你的图像是如何构造的(如果它是一个大盒子或几个小盒子),我就给你我的观点。

假设你有四个独立的盒子,我们以绿色那个为例。 如果方框范围是 20 到 25 BMI,那么我会按以下方式处理它

MaxBMI - MinBMI = 范围(在 20 和 25 的情况下,范围为 5)

然后计算您当前的 BMI(在本例中为 21.5)

CurBMI - MinBMI = DistanceFromMin(在本例中距离为 1.5)

然后只需取 (lengthOfBox / Range) * DistanceFromMin 即可知道箭头的位置。

如果这根本不能回答您的问题,我希望您能更好地说明问题。 (这真的是我在 Whosebug 上的第一个答案:P)

使用百分比怎么样?

假设您的图像是 200 像素,在 left/margin-left: 20% 的 200 像素图像的 bmi 为 20?

如果您可以提供更多关于您使用 link 代码实现的详细信息,我的答案会更清楚