I have this progress bar in JS and I'm filling up progress by increasing its width using this code:

function move(ValueSC) {
    var elem = document.getElementById("scaleOrig"); 
    var width = 0;
    var internalVlue = ValueSC;
    var id = setInterval(frame(internalVlue), 50);
    function frame(internalVlue) {
        if (width >= internalVlue) {
            clearInterval(id);
        } else {
            width += internalVlue; 
            elem.style.width = width + '%'; 
        }
    }
}  

This works perfectly but the problem is that I will get a value (result) from my calculator which is something between numbers 15 to 40, so with this stated 15 will be 0% and 40 will 100%. I want the width of progress bar to go up to 100 percent if the result (from my calculator) is 40 and if it is 15 the value of progress bar should be 0%. Basically I need the logic to convert all the 25 numbers from 15 to 40 to have a percentage value between 0 to 100%.

I have this progress bar in JS and I'm filling up progress by increasing its width using this code:

function move(ValueSC) {
    var elem = document.getElementById("scaleOrig"); 
    var width = 0;
    var internalVlue = ValueSC;
    var id = setInterval(frame(internalVlue), 50);
    function frame(internalVlue) {
        if (width >= internalVlue) {
            clearInterval(id);
        } else {
            width += internalVlue; 
            elem.style.width = width + '%'; 
        }
    }
}  

This works perfectly but the problem is that I will get a value (result) from my calculator which is something between numbers 15 to 40, so with this stated 15 will be 0% and 40 will 100%. I want the width of progress bar to go up to 100 percent if the result (from my calculator) is 40 and if it is 15 the value of progress bar should be 0%. Basically I need the logic to convert all the 25 numbers from 15 to 40 to have a percentage value between 0 to 100%.

• javascript
• math
• percentage

• On one number increase, percentage should go up by 4% – Rahul Arora Commented Jul 24, 2016 at 6:24
• @RahulArora Yes, That is correct – Zakriya Bilal Commented Jul 24, 2016 at 6:25
• 1 So whatever value you get, you just have to apply this logic, (value-15)*4 and if I am not wrong this should be the width – Rahul Arora Commented Jul 24, 2016 at 6:27
• @RahulArora I think this works! – Zakriya Bilal Commented Jul 24, 2016 at 6:29
• This is just basic arithmetic, which is definitely possible. – user663031 Commented Jul 24, 2016 at 6:33

4 Answers 4

As a broader answer, the formula you're looking for is ((value - min) / (max - min)) * 100. max and min are the bounds of your value and value is the current progress. This will return the percentage of the progress so far for any given value between two other values.

   var percent = ((value - 15) / (40 - 15)) * 100

40 will give you 100 and 15 will give you 0

Before you call your method do this:

ValueSC= ((Max-Min)/100)*(Current-Min))

Where: Current: Your value Min = Minimum Value Max = Max Value

First you have to divide up 100 to smaller steps. There can be 25 (40-15) different values for your number, so the length of a step should be 100 / 25, and your starting number is 15. Something like this should work:

function getPercentage(number) {
    return (number - 15) * (100 / 25);
}