diff --git a/src/common/util/colors.js b/src/common/util/colors.js index 7dc61aadb8..440e9107af 100644 --- a/src/common/util/colors.js +++ b/src/common/util/colors.js @@ -2,30 +2,30 @@ const turboPolynomials = { r: [0.13572138, 4.61539260, -42.66032258, 132.13108234, -152.94239396, 59.28637943], g: [0.09140261, 2.19418839, 4.84296658, -14.18503333, 4.27729857, 2.82956604], - b: [0.10667330, 12.64194608, -60.58204836, 110.36276771, -89.90310912, 27.34824973] + b: [0.10667330, 12.64194608, -60.58204836, 110.36276771, -89.90310912, 27.34824973], }; -function interpolateChannel(t, coeffs) { +function interpolateChannel(normalizedValue, coeffs) { let result = 0; - let tPower = 1; - for (let i = 0; i < coeffs.length; i++) { - result += coeffs[i] * tPower; - tPower *= t; + for (let i = 0; i < coeffs.length; i += 1) { + result += coeffs[i] * (normalizedValue ** i); } return Math.max(0, Math.min(1, result)); } -function interpolateTurbo(t) { - t = Math.max(0, Math.min(1, t)); +function interpolateTurbo(value) { + const normalizedValue = Math.max(0, Math.min(1, value)); return [ - Math.round(255 * interpolateChannel(t, turboPolynomials.r)), - Math.round(255 * interpolateChannel(t, turboPolynomials.g)), - Math.round(255 * interpolateChannel(t, turboPolynomials.b)) + Math.round(255 * interpolateChannel(normalizedValue, turboPolynomials.r)), + Math.round(255 * interpolateChannel(normalizedValue, turboPolynomials.g)), + Math.round(255 * interpolateChannel(normalizedValue, turboPolynomials.b)), ]; } -export function getSpeedColor(speed, max) { - const factor = Math.max(0, Math.min(1, speed / max)); - const [r, g, b] = interpolateTurbo(factor); +const getSpeedColor = (speed, maxSpeed) => { + const normalizedSpeed = Math.max(0, Math.min(1, speed / maxSpeed)); + const [r, g, b] = interpolateTurbo(normalizedSpeed); return `rgb(${r}, ${g}, ${b})`; -} +}; + +export default getSpeedColor; diff --git a/src/map/MapRoutePath.js b/src/map/MapRoutePath.js index 6338e47918..ae905676ae 100644 --- a/src/map/MapRoutePath.js +++ b/src/map/MapRoutePath.js @@ -2,7 +2,7 @@ import { useTheme } from '@mui/styles'; import { useId, useEffect } from 'react'; import { useSelector } from 'react-redux'; import { map } from './core/MapView'; -import { getSpeedColor } from '../common/util/colors'; +import getSpeedColor from '../common/util/colors'; const MapRoutePath = ({ positions }) => { const id = useId(); diff --git a/src/map/MapRoutePoints.js b/src/map/MapRoutePoints.js index ee216aec9e..7ee4dc6363 100644 --- a/src/map/MapRoutePoints.js +++ b/src/map/MapRoutePoints.js @@ -1,6 +1,6 @@ import { useId, useCallback, useEffect } from 'react'; import { map } from './core/MapView'; -import { getSpeedColor } from '../common/util/colors'; +import getSpeedColor from '../common/util/colors'; const MapRoutePoints = ({ positions, onClick }) => { const id = useId();