Question

所以在我查询玩家数据库后的游戏系统中，我得到的值介于0到1之间.0应该代表白色，1应该代表黑色。 0.01至0.99表示从白色到黑色的阴影。

我使用游戏数据在网页上显示玩家个人资料详情。

如何根据此十进制值动态创建逻辑以生成颜色代码？我需要让每个玩家的div的背景颜色为灰色阴影，由玩家的方向编号（0到1）表示

我尝试将background-color:black添加到div中，然后降低不透明度以模拟阴影中的变化。不幸的是，这也使得div内的内容也变得透明。我尝试将opacity:1添加到div中，但它不起作用。

所以我认为找到一种方法可以将十进制值转换为黑白之间的十六进制值。

非常感谢任何见解！

Answer 1

颜色以RGB（红色，绿色，蓝色）表示，每个值的范围在0到255之间，因此只需将每个颜色分量的值乘以255，然后设置div的背景颜色，如下所示：

＆＃13;

<div id="myDiv">This is a color test</div>

<script>
  var value = 0.1;
  var color_component = Math.ceil(255 * (1 - value));
  var color = "rgb(" + color_component + "," + color_component + "," + color_component + ")";
  document.getElementById("myDiv").style.backgroundColor = color;
</script>

＆＃13;

Answer 2

Racil有正确的想法，但不正确地构造了颜色。你可以做的一种方法是像他建议的那样计算颜色分量：

var color_component = 255 * (1 - value);

您可以使用它来生成这样的颜色：

var color = 'rgb(' + value + ', ' + value + ', ' + value + ')';

或者如果你想要更加偷偷摸摸，你可以通过将颜色分量转换为十六进制来将其转换为十六进制颜色，如下所示：

var hex = new Number(color).toString(16);
var color = '#' + hex + hex + hex + ';';

Answer 3

如果你只想使用PHP（如果0和1之间的结果来自PHP或数据库，那就更好了）我认为这可能是个好方法：

<?php
$res = 0.4; //that you have to put you result between 0 and 1
$rgb= intval($res*255);
$color = "rgb(".$rgb.", ".$rgb.", ".$rgb.")"; // the result of the code... for example "rgb(2, 2, 2)"
?>

然后你只需回应div风格的颜色。

PHP：使用十进制值添加div背景颜色（1 =黑色，0 =白色）

3 个答案: