Question

我正在使用jquery ui slider进行缩放。它应该从25％缩放到％500，大约一半的范围用于第一个％100的大小。

滑块的值为1到100.我需要一些可用于根据滑块值计算缩放的功能，例如

function getZoom(sliderVal) {
    //return number from 25 to 500
}

有什么建议吗？

Answer 1

我认为如果你提供指数拟合，对用户来说会更好。

Javascript有Math.pow（a，b），它计算^b。

如果将范围[0,100]映射到[25％，400％]，设置会更有意义，因为50就是准确的中点，并且可以很容易地映射到100％。滑块上的50个点对应于除法或乘以4，因此您可以设置

scaling = Math.pow(2,(slider - 50) / 25);

那么你得到下面的映射：

slider     scaling
------------------
     0     2**-2 = 1/4 =  25%
    25     2**-1 = 1/2 =  50%
    50     2**0  = 1   = 100%
    75     2**1  = 2   = 200%
   100     2**2  = 4   = 400%

现在我看到这完全没有回答你的问题，因为你的比例是[1,100]而不是[0,100]，而你希望达到500％而不是400％。

要到达那里，您可以先将滑块标准化：

slider_n = (slider - 1) * (100/99);

（将[1,100]映射到[0,100]），然后，如果需要，将指数的正值乘以（log 5）/（log 4），以便您的比例结束在500％，即

exp = (slider_n - 50) / 25.0;
if (exp > 0) exp = exp * Math.log(5)/Math.log(4);
scaling = Math.pow(2,exp);

Answer 2

基本上你想重新调整1-100到25-500之间的东西。

100-1 = 99
500-25 = 475

这是你的缩放系数 - 滑块上的每个差异点都是缩放上的475/99点差异。

固定偏移量仅为1和25，为您提供了一个简单的公式：

f( slider_value ) =
    ( slider_value - 1 ) * ( 475 / 99 ) + 25

当然，如果您想要概括，从(a,b)到(c,d)的两个比例：

 f( slider_value ) =
     ( slider_value - a ) * ( ( d - c ) / ( b - a ) ) + c

现在，如果你想做一半的事情，你可以使用上面的公式来划分你想要的部分，并调用不同的功能根据滑块的值而变化。只要它们是连续的（边界情况的值相同），它应该感觉很好。

对于您的情况，请尝试将1-50.5映射到25％-100％，50.5-100到100％-500％。

适合缩放的滑块值的功能

2 个答案: