5

位置に応じて 0 ～ 1 の値を出力する JavaScript スライダーがあります。その値を、たとえば 100 から 1000 の間の別のスケールの値に変換したいのですが、100 から 1000 の間の一連のデータ ポイントの分布に基づいています。

ここでの使用例は、数値のセットが非常に近い場合に、スライダーの変化に対する感度を低くしたいということです。例...スケールの値が次のとおりであるとしましょう:

100, 200, 300, 500, 1000

100 ～ 500 の値は、分布が狭いため、たとえばスライダーの最初の 80% を占める可能性があり、そのため、それらの間で選択しやすくなります。

おそらく標準偏差と係数を含む、これを計算するための数学関数が明らかにあります。誰がそれが何であるか知っていますか？

4

4 に答える 4

2

大規模な値の間で線形補間を使用すると、次のようになります。

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-04T18:50:32.460 に答える
1

スライダーの値を独立変数として使用する、あらゆる種類の多項式が機能すると思います。特定の方程式は、特定のニーズ/分布によって異なります。

たとえば、-1 * (X^2)次の場合、偶数の逆放物線が得られますX = 10 * [slider value]

于 2012-01-04T17:42:34.580 に答える
1

任意の値については、ある種のスプライン補間を提案します。値のセットをポイントのセットに変換します。ここで、2 番目の座標は「スライダー スケール」にあります。

    (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-04T17:51:10.203 に答える
0

（コメントで元の質問とは反対の質問をするためのエチケットが何であるかはわかりませんが、コードに収まるように追加の回答として追加します。）

以前のように宣言されたすべての変数を使用して、以前の回答から続けます。

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-03T20:29:29.143 に答える