three.js 中的复杂十六进制颜色值

Question

我只是在搞乱three.js，遇到了以下示例HERE。我看到以下初始化函数（我没有发布整个函数，而只是其中的一部分）：

    function init() {

        renderer = new THREE.WebGLRenderer( { antialias: true } );
        renderer.setPixelRatio( window.devicePixelRatio );
        renderer.setSize( window.innerWidth, window.innerHeight );
        container.appendChild( renderer.domElement );

        scene = new THREE.Scene();

        camera = new THREE.PerspectiveCamera( fov, window.innerWidth / window.innerHeight, 1, 1000 );
        camera.position.z = 100;
        camera.target = new THREE.Vector3();

        controls = new THREE.OrbitControls( camera, renderer.domElement );
        controls.minDistance = 50;
        controls.maxDistance = 200;

        scene.add( new THREE.AmbientLight( 0x443333 ) );

        var light = new THREE.DirectionalLight( 0xffddcc, 1 );
        light.position.set( 1, 0.75, 0.5 );
        scene.add( light );

        var light = new THREE.DirectionalLight( 0xccccff, 1 );
        light.position.set( -1, 0.75, -0.5 );
        scene.add( light );
        //.....  more code
}

现在在几个地方我看到使用了以下代码行：

scene.add( new THREE.AmbientLight( 0x443333 ) );

当我浏览函数 AmbientLight 的文档时，我得到以下信息：

AmbientLight 文档，

环境光（颜色，强度）

color — 颜​​色的 RGB 分量的数值。强度 - 光强度/强度的数值。

但是 0x443333 到底是什么，我从来没有遇到过这样的事情。有人能解释一下0x443333 到底是什么意思吗？

Answer 1

十六进制颜色是一个十六进制编码字符串，表示颜色的 RGB 值。
您可以将此代码拆分为三个单独的hexadecimal 部分；一种用于红色、绿色和蓝色 (RGB)；

十六进制编码的工作原理如下：

0 : 0
1 : 1
2 : 2
3 : 3
4 : 4
5 : 5
6 : 6
7 : 7
8 : 8
9 : 9
a : 10
b : 11
c : 12
d : 13
e : 14
f : 15

所以你的RGB值如下：

Red   = 44 -> 4 x 16 + 4 -> 68
Green = 33 -> 3 x 16 + 3 -> 51
Blue  = 33 -> 3 x 16 + 3 -> 51

所以这个颜色代表下面的RGB颜色：rgb(68,51,51)。

这种编码允许表示 256 x 256 x 256 = 16777216 种不同的颜色。

white : 0x000000 = rgb(0,0,0);
black : 0xffffff = rgb(255,255,255);
red   : 0xff0000 = rgb(255,0,0);
green : 0x00ff00 = rgb(0,255,0);
blue  : 0x0000ff = rgb(0,0,255);

检查this reference 了解彩虹的所有其他颜色...