0

ズームには jquery ui スライダーを使用しています。25% から %500 までズームすることになっており、範囲の約半分がサイズの最初の %100 に使用されます。

スライダーには 1 から 100 までの値があります。スライダーの値に基づいてズームを計算するために使用できる関数が必要です。

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

助言がありますか？

4

2 に答える 2

2

指数フィッティングを提供する方がユーザーにとっては良いと思います。

Javascriptには、a bを計算するMath.pow（a、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%

スケールが[0,100]ではなく[1,100]であり、400％ではなく500％に到達したいので、これでは質問に完全には答えられないことがわかります。

そこに到達するには、最初にスライダーを正規化できます。

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);
于 2010-03-05T21:26:16.993 に答える
1

基本的に、何かを 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)までの 2 つのスケール(c,d):

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

ここで、ある種の半分半分のことをしたい場合は、上記の式を使用して必要な部分を分割し、スライダーの値に応じてさまざまな関数を呼び出すことができます。それらが連続している限り (境界の場合でも値は同じです)、問題なく感じられるはずです。

あなたの場合、1-50.5 を 25%-100% に、50.5-100 を 100%-500% にマッピングしてみてください。

于 2010-03-05T20:00:23.170 に答える