根据渐变色标定义许多css类的颜色

Question

我有一个渐变色标，我想为它定义一组类。

要将其分解，我的值可以在 0 和 8.5 之间，步长 0.25 。我总共有 34 不同的颜色（8.5 / 0.25 = 34），我希望在这个渐变色标范围内。所以我需要定义34个不同的类，每个类都比我在数据库中的数量还要小。因此，如果我发现2.25的值，我想在我的渐变比例中得到 29.4％（（2.25 * 100 /）8.5 = 29.4）的颜色。我怎么能用css类来做到这一点？

我这样做的原因是为我放置在地图上的图标添加颜色。值是速度，并根据我需要在地图上添加一个类到我的图标所需的速度，该图标包含与速度的“值”匹配的背景（颜色）？

我在过去的30分钟里尝试使用谷歌搜索，但我发现自己无法找到任何可以使用的内容。

如果这看起来非常直观，我愿意尝试其他可以帮助我实现我需要的解决方案。

如果它具有任何重要性，我使用MapBox作为我的地图解决方案。

Answer 1

尝试使用SCSS。在SCSS中，您可以使用变量和数学。