JavaScript滑塊加權值

我有一個JavaScript滑塊，根據它的位置輸出0到1之間的值。我想將該值轉換爲100至1000之間的另一個比例值，但是基於100到1000之間的一組數據點的分佈。JavaScript滑塊加權值

這裏的用例是我希望滑塊是當數字非常接近時，對變化不太敏感。如...讓我們說，在規模的值是：

100, 200, 300, 500, 1000

值100-500可能佔用，比如說，滑塊的前80％，由於其分佈接近，因此更容易選擇它們之間。

顯然有一個數學函數來計算它，可能涉及標準偏差和係數。有人知道這是什麼嗎？

來源

2012-01-04 Andy Hume

上大規模使用值之間的線性插值，像

var bigValues = [100, 200, 300, 500, 1000]; 
var input; /* will vary in the range [0.0..1.0] */ 
var idx; /* index of nearest entry in bigValues below input */ 
var frac; /* fraction [0.0..1.0) in interval in bigValues */ 
var output; 
/* try some test values for input */ 
for (var i = 0; i<=20; i++) { 
    input = i * 0.05; 
    idx = Math.floor(input * (bigValues.length - 1)); 

    frac = (input - (idx)/(bigValues.length - 1)) * (bigValues.length - 1); 
    if (frac == 0) { /* no need to calculate */ 
     output = bigValues[idx]; 
    } 
    else { 
     output = bigValues[idx] + (bigValues[idx+1] - bigValues[idx]) * frac; 
    }; 
    document.write(input + ', ' + output + '<br />'); 
}

來源

2012-01-04 18:50:32

謝謝，T他的工作很好。逆轉這種計算的最佳方法是什麼？ – 2012-02-03 17:54:02

我會認爲，任何形式的多項式方程，使用滑塊值作爲獨立變量將工作。具體的等式將取決於您的具體需求/分佈。

例如，-1 * (X^2)會給你，如果X = 10 * [slider value]

來源

2012-01-04 17:42:34 cdeszaq

爲任意值，我會提出某種形式的樣條插值的甚至倒拋物線。將您的值設置爲一組點，其中第二個座標是在「滑塊刻度」的：

(100, 0.0), (200, 0.25), (300, 0.5), (500, 0.75), (1000, 1.0)

現在只需使用您的選擇創建平滑曲線的樣條插值，並且一旦你的曲線你可以得到100-1000的數值。

如果您不想實現任何複雜的樣條插值，可以採用線性插值，這意味着對於0.0到0.25之間的任何滑塊點，可以在100和200之間進行線性插值，插值在0.25和0.5之間200至300之間等等。

來源

2012-01-04 17:51:10 dom

（我不知道禮儀什麼要求相對原來的問題在a comment，但我會添加它作爲一個附加的應答，以適應代碼）

從my previous answer繼續，以聲明爲前所有變量：

document.write('The other way round:<br />'); 

function findIntervalStart(n) { 
    for (var i = 1; i < bigValues.length; i++) if (n < bigValues[i]) return i-1; 
} 
/* try some test values */ 
for (var i = 1; i <= 21; i++) {  
    output = i * 50; 
    if (output >= bigValues[bigValues.length - 1]) { 
     input = 1; 
    } 
    else if (output <= bigValues[0]) { 
     input = 0; 
    } 
    else { 
    idx = findIntervalStart(output); 
     frac = (output - bigValues[idx])/(bigValues[idx + 1] - bigValues[idx]); 
     input = (idx + frac)/(bigValues.length - 1); 
    }; 

    document.write(output + ', ' + input + '<br />'); 
}

來源

2012-02-03 20:29:29

JavaScript滑塊加權值

回答

相關問題