Log Scaling

by lbstr

HTML

<div id="log"></div>

JavaScript

var toInputVal, toSliderVal;

var setScalingFunctions = function(scaling, min, max) {
    var scale;
    if (scaling === 'Linear') {
        scale = (max-min) / 100;
        toInputVal = function(sliderVal) {
            return min + scale*sliderVal;
        };
        toSliderVal = function(inputVal) {
            return (inputVal - min) / scale;
        };
    }
    else if (scaling === 'Logarithmic') {
        scale = (Math.log(max)-Math.log(min)) / 100;
        toInputVal = function(sliderVal) {
            return Math.exp(Math.log(min) + scale*sliderVal);
        };
        toSliderVal = function(inputVal) {
            return (Math.log(inputVal) - Math.log(min)) / scale;
        };
    }
};

var log = function(msg){
    var parent = document.getElementById('log'),
        child = document.createElement('p');
    
    child.innerHTML = msg;
    parent.appendChild(child);
};


setScalingFunctions('Logarithmic', 100, 200000);
log(toInputVal(0));
log(toInputVal(25));
log(toInputVal(50));
log(toInputVal(75));
log(toInputVal(100));
log('---');
log(toSliderVal(100));
log(toSliderVal(50000));
log(toSliderVal(150000));
log(toSliderVal(200000));
log('---');

setScalingFunctions('Linear', 100, 200000);
log(toInputVal(0));
log(toInputVal(25));
log(toInputVal(50));
log(toInputVal(75));
log(toInputVal(100));
log('---');
log(toSliderVal(100));
log(toSliderVal(50000));
log(toSliderVal(150000));
log(toSliderVal(200000));
log('---');