jQuery के यूआई स्लाइडर लघुगणकीय पैमाने

Question

मैं लघुगणक स्लाइडर के लिए इस jQuery के यूआई कोड का उपयोग करें:

var minVal = 10; var maxVal = 100; $("#slider").slider({ 
    range: true, 
    min: minVal, 
    max: maxVal/2, 
    values: [ minVal, maxVal ], 
    slide: function(event, ui) { 
     $("#amount_min").val(Number(expon(ui.values[ 0 ], minVal, maxVal)).toFixed(0)); 
     $("#amount_max").val(Number(expon(ui.values[ 1 ], minVal, maxVal)).toFixed(0)); 

    } 
}); 

expon समारोह है:

function expon(val, min,max) 
{ 

     var minv = Math.log(min); 
     var maxv = Math.log(max); 
     max = max/2; 

     // calculate adjustment factor 
     var scale = (maxv-minv)/(max-min); 

     return Math.exp(minv + scale*(val-min)); 

} 

और #amount_min और #amount_max एचटीएमएल इनपुट तत्व हैं। उपरोक्त कोड स्लाइडर से मूल्य प्राप्त करने और इसे इनपुट तत्वों में रखने के लिए ठीक काम करता है।

लेकिन अब मुझे इनपुट के मूल्य को बदलने पर स्लाइडर बदलने के लिए एक्सपोन() के विपरीत फ़ंक्शन की आवश्यकता है। क्या कोई मेरी इसके साथ मदद कर सकता है?

Answer 1

मैं समाधान मिला:

var gMinPrice = 100; 
var gMaxPrice = 1000; //in my project these are dynamic 

function expon(val){ 
    var minv = Math.log(gMinPrice); 
    var maxv = Math.log(gMaxPrice); 
    var scale = (maxv-minv)/(gMaxPrice-gMinPrice); 
    return Math.exp(minv + scale*(val-gMinPrice)); 

} 
function logposition(val){ 
    var minv = Math.log(gMinPrice); 
    var maxv = Math.log(gMaxPrice); 
    var scale = (maxv-minv)/(gMaxPrice-gMinPrice); 
    return (Math.log(val)-minv)/scale + gMinPrice; 
} 

मैं तो इस का उपयोग करते हुए मेरी स्लाइडर स्थिति को बदलते हैं: Logarithmic slider

मैं एक परियोजना के लिए अपने बहुत मददगार कोड का उपयोग किया है ... इस मैं क्या है कोड:

var gBudgetBottom, gBudgetTop; 
$('#priceSlider').slider({ 
    change: function(event, ui){ // inside your slider instance 
     gBudgetBottom = Number(expon(ui.values[0])).toFixed(0); 
     gBudgetTop = Number(expon(ui.values[1])).toFixed(0); 
    } 
} 

$('#priceSlider').slider({ values: [Number(logposition(gBudgetBottom)).toFixed(0), Number(logposition(gBudgetTop)).toFixed(0)] }); 

मुझे आशा है कि आप के लिए काम करता है :)

Answer 2

मैंने यही किया:

var resStepValues = [0, .01, .02, .03, .04, .05, 1, 1.5, 2, 3, 4, 5, 10, 20, 30, 40, 50, 60, 70, 80, 90, 100, 150, 200, 250, 300, 500, 750, 1000, 1500]; 

var slider = $("#resolution_slider").slider({ 
    animate: true, 
    min: 0, 
    max: 29, 
    range: 'min', 
    values: [0, 29], 
    slide: function (event, ui) { 

     if (ui.values[0] > ui.values[1]) { 
      $("#txtMaxRes").val(resStepValues[ui.values[1]]); 
      $("#txtMinRes").val(resStepValues[ui.values[0]]); 

     } else { 
      $("#txtMaxRes").val(resStepValues[ui.values[0]]); 
      $("#txtMinRes").val(resStepValues[ui.values[1]]); 
     } 
    } 

});