javascript slider weighted values

Question

I have a JavaScript slider that outputs a value between 0 and 1 depending on its position. I want to convert that value to a value on another scale between say 100 and 1000, but based on the distribution of a set of data points between 100 and 1000.

The use case here is that I want the slider to be less sensitive to changes when there is a very close set of numbers. Eg... let's say the values in the scale are:

100, 200, 300, 500, 1000

The values 100-500 might take up, say, the first 80% of the slider due to their closer distribution, therefore making it easier to select between them.

There's clearly a mathematical function for calculating this, perhaps involving standard deviation and coefficients. Anyone know what it is?

Answer 1

Using linear interpolation between the values on the large scale, something like

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 />');
}

Answer 2

I would think that any sort of polynomial equation, using the slider values as the independent variable would work. The specific equation would depend on your specific needs / distribution.

For example, -1 * (X^2) would give you an even inverted parabola if X = 10 * [slider value]