PHP Logo

Map A Value Between Scales

14th August 2020 - 3 minutes read time

A common technique when creating graphics or visual representations of data is to map a value between two scales. This is useful when working on a set of values and you need to map them to a different set of values in order to show them on a graph.

The maths involved here is essentially figuring out the relationship between the value (v) in our initial scale (x, y) and multiplying this by the maximum range of the second scale (a, b).

  1. a + (b - a) * ((v - x) / (y - x))

Taking the value of 0.5, which is in the scale 0 to 1. Mapping this to the scale 0 to 100 means we make the following calculations.

0 + (100 − 0) × ((0.5 − 0) ÷ (1 − 0))

This results in the value of 50.