Формула для расчета значений левого и ширины (на основе значений 0% и 100%) - PullRequest
0 голосов
/ 05 октября 2011

Как мне найти формулу, которая на основе процентного значения дала бы мне значения left и width на основе следующих значений 0% и 100%?

Для 0,00 процента, слева и сзначения будут:

  • Ширина: 658
  • Слева: 11

Для 100,00 процентов значения влево и ширина будут:

  • Ширина: 0 (или 1)
  • Слева: 670

У меня есть градиентное изображение, к которому я применяю цвет, чтобы придать визуальному значению процентное значениепредставление.Градиентное изображение начинается с 11 пикселей (слева: 11 для 0,00%) и имеет ширину 659 (слева: 670 для 100,00% = 659 + 11)

Значения слева и ширины должнывычислять динамически на основе процента, чтобы цвет перекрывал градиент.

Если процент равен 0%, цвет будет перекрывать весь градиент (слева: 11, ширина: 659)

------------------------------
|____________________________|
0                            100

Если процент составляет 100%, цвет не будет перекрывать градиент вообще (слева: 670, что составляет 659 + 11, ширина: 1 или 0)

                              -
|____________________________|
0                            100

1 Ответ

2 голосов
/ 05 октября 2011

Формула, которую вы ищете, может быть выражена как f(x) = ax+b. f (x) - это ширина, которую вы хотите получить, x - это процент, а a & b - (в настоящее время неизвестные) константы.

Если у вас есть значение f (x) для двух точек (например, 0 и 100), вы можете вывести формулу следующим образом:

f(0) = valueAtZero = a*0 + b
b = valueAtZero
f(100) = valueAtOneHundred = a*100 + b
valueAtOneHundred - b = a*100
a = (valueAtOneHundred - b) / 100

Теперь, когда у вас есть a и b, вы можете решить для любого процента x, который вы хотите. Вышеуказанный процесс переводится в псевдокод как:

function getValueAtXPercent(x, valueAtZero, valueAtOneHundred):
    b = valueAtZero
    a = (valueAtOneHundred - b) / 100
    return a*x + b

теперь вы можете вызвать getValueAtXPercent (50, 658, 1), и он вернет значение вашей ширины на 50%.

Вот конкретная реализация в python:

def f(x, valueAtZero, valueAtOneHundred):
    b = valueAtZero
    a = (valueAtOneHundred - b) / 100.0
    return a*x + b

def showStats(percent):
    left = f(percent, 11, 670)
    width = f(percent, 658, 0)
    output = "At {0}%, left={1} and width={2}".format(percent, left, width)
    print output

showStats(0)
showStats(50)
showStats(100)

выход:

At 0%, left=11.0 and width=658.0
At 50%, left=340.5 and width=329.0
At 100%, left=670.0 and width=0.0
...