javascript slider weighted values ​​

Question

Tôi có một thanh trượt JavaScript xuất ra một giá trị từ 0 đến 1 tùy thuộc vào vị trí của nó. Tôi muốn chuyển đổi giá trị đó thành giá trị trên thang điểm khác trong khoảng từ 100 đến 1000, nhưng dựa trên phân phối của một tập hợp các điểm dữ liệu từ 100 đến 1000.

Trường hợp sử dụng ở đây là tôi muốn thanh trượt ít nhạy cảm hơn với những thay đổi khi có một tập hợp các con số rất gần. Ví dụ ... giả sử các giá trị trong thang đo là:

100, 200, 300, 500, 1000 

Giá trị 100-500 có thể chiếm 80% thanh trượt do phân phối gần hơn, do đó giúp dễ dàng chọn giữa họ.

Rõ ràng là một hàm toán học để tính toán điều này, có lẽ liên quan đến độ lệch chuẩn và hệ số. có ai biết nó là cái gì không?

Answer 1

Sử dụng phép nội suy tuyến tính giữa các giá trị trên quy mô lớn, một cái gì đó giống như

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

Tôi nghĩ rằng bất kỳ loại phương trình đa thức nào, sử dụng giá trị thanh trượt như biến độc lập sẽ hoạt động. Phương trình cụ thể sẽ phụ thuộc vào nhu cầu/phân phối cụ thể của bạn.

Ví dụ, -1 * (X^2) sẽ cung cấp cho bạn một parabol thậm chí đảo ngược nếu X = 10 * [slider value]

Answer 3

Đối với giá trị tùy ý tôi muốn đề xuất một số loại spline suy. Chuyển đổi thiết lập của bạn giá trị cho một tập hợp các điểm, nơi tọa độ thứ hai là trong "quy mô trượt":

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

Bây giờ chỉ cần sử dụng suy spline của sự lựa chọn của bạn để tạo ra một đường cong trơn tru, và một khi bạn có đường cong bạn có thể nhận được các giá trị trên thang điểm 100-1000 của mình.

Nếu bạn không muốn thực hiện bất kỳ phép nội suy phức tạp nào, bạn có thể thực hiện phép tuyến tính, nghĩa là đối với bất kỳ điểm nào trong thanh trượt của bạn giữa 0,0 và 0,25 bạn nội suy tuyến tính giữa 100 và 200, giữa 0,25 và 0,5 nội suy từ 200 đến 300 và cứ thế.

Answer 4

(Tôi không biết những gì các nghi thức là cho yêu cầu đối diện với câu hỏi ban đầu trong a comment, nhưng tôi sẽ thêm nó như là một câu trả lời bổ sung cho phù hợp với những mã trong)

Tiếp tục trên từ my previous answer, với tất cả các biến khai báo là trước đây:.

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