【发布时间】：2020-07-12 08:07:37
【问题描述】：
我的问题主要是数学问题，但这里有一些上下文： 我有一个 HTML 范围输入（基本上是一个滑块），表示地图对象（开放图层）的透明度，百分比范围为 0-100。我在 javaScript 中的 onChange 函数应该将百分比值转换为不透明度，范围为 1-0。
这两个范围是间接成比例的，这意味着 0% 的透明度值应该导致不透明度值 1，而透明度值例如70% 应导致 0.3 不透明度等。
透明度：[0...100]
不透明度：[1...0]
我在 react 中编码，所以不透明度来自组件状态。输入值使用 opacity 计算透明度值，onChange 函数从透明度重新计算 opacity 并设置组件状态。
为了给你一个想法，这里是一些伪代码：
<input
type="range"
min="0"
max="100"
rows="1"
value={opacity =complicatedConversion=> transparency}
onChange={e => {
this.setState({opacity: transparency =complicatedConversion=> opacity});
}}
/>
我需要将范围值转换为另一个范围中相应值的公式。我试图想出一个公式，但通常最终会被零除或导致不透明度大于 1。
最简单的解决方法是忘记透明度而只使用不透明度，但我的任务要求很严格，我认为这种类型的公式在其他情况下可能会派上用场。
周围有没有数学头脑可以给我一个提示？或者有人知道这些范围的公式吗？
非常感谢
【问题讨论】：
-
透明度以百分比表示。要将百分比转换为数值，请除以 100。100%/100 = 1、30%/100 = 0.3。但这是transparency，你想要相反的opacity。
1 - transparency number = opacity number.
标签： reactjs math transparency opacity