javascript 在两个数字范围之间缩放
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14224535/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Scaling between two number ranges
提问by alyx
I remember using an equation to do this at some point – how do you do this in Javascript?
我记得在某个时候使用一个方程来做这件事——你如何在 Javascript 中做到这一点？
Plugin two number ranges:
插件两个数字范围：
rangeX = 1 (through) 10;
rangeY = 300.77 (through) 559.22;
Input a value in the rangeY scale:
在 rangeY 范围内输入一个值：
inputY = 328.17;
Convert to proportional value in rangeX scale:
转换为 rangeX 比例中的比例值：
outputX = 1.43;
回答by oleq
function convertRange( value, r1, r2 ) {
return ( value - r1[ 0 ] ) * ( r2[ 1 ] - r2[ 0 ] ) / ( r1[ 1 ] - r1[ 0 ] ) + r2[ 0 ];
}
convertRange( 328.17, [ 300.77, 559.22 ], [ 1, 10 ] );
>>> 1.9541497388276272
回答by Foggzie
Use percentages:
使用百分比：
xMax = 10;
xMin = 1;
yMax = 559.22;
yMin = 300.77;
percent = (inputY - yMin) / (yMax - yMin);
outputX = percent * (xMax - xMin) + xMin;
回答by Chamila Chulatunga
No guarantees on the math, but I think something like this:
在数学上没有保证，但我认为是这样的：
var xLow = 1;
var xHigh = 10:
var yLow = 300.77;
var yHigh = 559.22;
var inputY = 328.17;
var ouputX = xLow;
var scaleYOverX = (yHigh - yLow)/(xHigh - xLow);
if(inputY >= yLow && inputY <= yHigh) {
outputX = (inputY - yLow)/scaleYOverX + xLow;
alert(outputX);
} else {
alert("Invalid input for Y scale");
}
回答by EdwardSanchez
Swift 3With Bool for extended range or not
Swift 3with Bool 是否扩展范围
func translate(input : Float, inputMin: Float, inputMax: Float, outputMin: Float, outputMax: Float, extendRange: Bool? = false, log: Bool? = false) -> Float {
//The actual translation function
func translationResult(_ inputMinA: Float, _ inputMaxA: Float) -> Float {
let myResult = outputMin + (outputMax - outputMin) * (input - inputMinA) / (inputMaxA - inputMinA)
return myResult
}
// extendRange true means it'll return a value outside the range of inputMin and inputMax but still follow the ratio
if extendRange! {
return result = translationResult(inputMin, inputMax)
if log! == true && input > inputMax || input < inputMin{
print("outside range!")
}
} else {
//Doesn't let value go outside range
let inputMinA = min(inputMin, input)
let inputMaxA = max(inputMax, input)
return result = translationResult(inputMinA, inputMaxA)
}
}
translate(input: 50, inputMin: 100, inputMax: 1000.0, outputMin: 1, outputMax: 10, extendRange: false) => 1
translate(input: 50, inputMin: 100, inputMax: 1000.0, outputMin: 1, outputMax: 10, extendRange: true) => 0.5
回答by Alex K
I turned @Foggzie's answer into a TypeScript function and ES2016 function.
我把@Foggzie 的答案变成了一个 TypeScript 函数和 ES2016 函数。
TypeScript:
打字稿：
const scale = (inputY: number, yRange: Array<number>, xRange: Array<number>): number => {
const [xMin, xMax] = xRange;
const [yMin, yMax] = yRange;
const percent = (inputY - yMin) / (yMax - yMin);
const outputX = percent * (xMax - xMin) + xMin;
return outputX;
};
ES2016:
ES2016：
const scale = (inputY, yRange, xRange) => {
const [xMin, xMax] = xRange;
const [yMin, yMax] = yRange;
const percent = (inputY - yMin) / (yMax - yMin);
const outputX = percent * (xMax - xMin) + xMin;
return outputX;
};
