颜色([name])

表示一个颜色。

代码示例

颜色可以用以下任意一种方式初始化。 //empty constructor - will default white const color1 = new THREE.Color(); //Hexadecimal color (recommended) const color2 = new THREE.Color( 0xff0000 ); //RGB string const color3 = new THREE.Color("rgb(255, 0, 0)"); const color4 = new THREE.Color("rgb(100%, 0%, 0%)"); //X11 color name - all 140 color names are supported. //Note the lack of CamelCase in the name const color5 = new THREE.Color( 'skyblue' ); //HSL string const color6 = new THREE.Color("hsl(0, 100%, 50%)"); //Separate RGB values between 0 and 1 const color7 = new THREE.Color( 1, 0, 0 );

构造器(Constructor)

[name]( [param:Color_Hex_or_String r], [param:Float g], [param:Float b] )

[page:Color_Hex_or_String r] - (可选参数) 如果参数g和b被定义,则r表示颜色中的红色分量。 如果未被定义,r可以是一个十六进制 [link:https://en.wikipedia.org/wiki/Web_colors#Hex_triplet hexadecimal triplet] 颜色值或CSS样式的字符串或一个Color实例。
[page:Float g] - (可选参数) 如果被定义,表示颜色中的绿色分量。
[page:Float b] - (可选参数) 如果被定义,表示颜色中的蓝色分量。

注意使用十六进制 [link:https://en.wikipedia.org/wiki/Web_colors#Hex_triplet hexadecimal triplet] 定义一个颜色在three.js中是标准的方法,而且其余 文档也将会使用这个方法。

当所有参数被定义时,r是红色分量,g是绿色分量,b是蓝色分量。
当只有 [page:Color_Hex_or_String r] 被定义时:

属性(Properties)

[property:Float r]

红色通道的值在0到1之间。默认值为1。

[property:Float g]

绿色通道的值在0到1之间。默认值为1。

[property:Float b]

蓝色通道的值在0到1之间。默认值为1。

方法(Methods)

[method:Color add]( [param:Color color] )

将给定颜色的RGB值添加到此颜色的RGB值。

[method:Color addColors]( [param:Color color1], [param:Color color2] )

将此颜色的RGB值设置为 [page:Color color1] 和 [page:Color color2] 的RGB值之和。

[method:Color addScalar]( [param:Number s] )

给现有的RGB值都加上 [page:Number s] 。

[method:Color clone]()

返回一个与当前颜色的 [page:.r r], [page:.g g] 和 [page:.b b] 相同的颜色。

[method:Color copy]( [param:Color color] )

从 [page:Color color] 中拷贝 [page:.r r], [page:.g g] 和 [page:.b b] 值到当前的颜色。

[method:Color convertGammaToLinear]( [param:Float gammaFactor] )

[page:Float gammaFactor] - (可选参数). 默认值 *2.0*.

通过取颜色 [page:.r r], [page:.g g] and [page:.b b] 的 [page:Float gammaFactor] 次方将颜色从伽马空间转换成线性空间。

[method:Color convertLinearToGamma]( [param:Float gammaFactor] )

[page:Float gammaFactor] - (可选参数). 默认值 *2.0*.

通过取颜色 [page:.r r], [page:.g g] and [page:.b b] 的 1/[page:Float gammaFactor] 次方将颜色从线性空间转换成伽马空间。

[method:Color convertLinearToSRGB]()

将此颜色从线性空间转换成sRGB空间。

[method:Color convertSRGBToLinear]()

将此颜色从sRGB空间转换成线性空间。

[method:Color copyGammaToLinear]( [param:Color color], [param:Float gammaFactor] )

[page:Color color] — 需要拷贝的颜色。
[page:Float gammaFactor] - (可选参数). 默认值为 *2.0*.

将传入的 [param:Color color] 从伽马空间转换到线性空间然后复制给当前颜色。

[method:Color copyLinearToGamma]( [param:Color color], [param:Float gammaFactor] )

[page:Color color] — 需要拷贝的颜色。
[page:Float gammaFactor] - (可选参数). 默认值为 *2.0*.

将传入的 [param:Color color] 从线性空间转换到伽马空间然后复制给当前颜色。

[method:Color copyLinearToSRGB]( [param:Color color]] )

[page:Color color] — 需要拷贝的颜色。
将传入的 [param:Color color] 拷贝给当前颜色,然后将当前颜色从线性空间转换到sRGB空间。

[method:Color copySRGBToLinear]( [param:Color color] )

[page:Color color] — 需要拷贝的颜色。
将传入的 [param:Color color] 拷贝给当前颜色,然后将当前颜色从sRGB空间转换到线性空间。

[method:Boolean equals]( [param:Color color] )

将 [param:Color color] 的RGB值与该对象的RGB值进行比较。如果它们都是相同的,返回true,否则返回false。

[method:Color fromArray]( [param:Array array], [param:Integer offset] )

[page:Array array] - 格式为 [ [page:Float r], [page:Float g], [page:Float b] ] 的数组 [page:Array]。
[page:Integer offset] - 数组中可选偏移量

从格式为[ [page:Float r], [page:Float g], [page:Float b] ]的数组数据中来创建Color对象。

[method:this fromBufferAttribute]( [param:BufferAttribute attribute], [param:Integer index] )

[page:BufferAttribute attribute] - 数据源
[page:Integer index] - 索引值

根据参数 [page:BufferAttribute attribute] 设置该颜色。

[method:Integer getHex]()

返回此颜色的十六进制值。

[method:String getHexString]()

将此颜色的十六进制值作为字符串返回 (例如, 'FFFFFF')。

[method:Object getHSL]( [param:Object target] )

[page:Object target] — 结果将复制到这个对象中。向对象添加h、s和l键(如果不存在)。

将此颜色的 [page:.r r], [page:.g g] 和 [page:.b b] 值转换为 [link:https://en.wikipedia.org/wiki/HSL_and_HSV HSL]格式,然后返回一个格式如下的对象: { h: 0, s: 0, l: 0 }

[method:String getStyle]()

以CSS样式字符串的形式返回该颜色的值。例如:“rgb(255,0,0)”。

[method:Color lerp]( [param:Color color], [param:Float alpha] )

[page:Color color] - 用于收敛的颜色。
[page:Float alpha] - 介于0到1的数字。

将该颜色的RGB值线性插值到传入参数的RGB值。alpha参数可以被认为是两种颜色之间的比例值,其中0是当前颜色和1.0是第一个参数的颜色。

[method:this lerpColors]( [param:Color color1], [param:Color color2], [param:Float alpha] )

[page:Color color1] - 开始的颜色。
[page:Color color2] - 结束收敛的颜色。
[page:Float alpha] - 介于0到1的数字。

将该颜色设置为线性插值颜色 [page:Color color1] 和 [page:Color color2] - 在此 alpha 是连接两种颜色的直线百分比距离 alpha = 0 时为 [page:Color color1], alpha = 1 时为 [page:Color color2]。

[method:Color lerpHSL]( [param:Color color], [param:Float alpha] )

[page:Color color] - 用于收敛的颜色。
[page:Float alpha] - 介于0到1的数字。

将该颜色的HSL值线性插值到传递参数的HSL值。它不同于上诉的[page:lerp]。通过不直接从一种颜色插入到另一种颜色, 而是通过插值这两种颜色之间的所有色相(H)、亮度(L)、饱和度(S)。alpha参数可以被认为是两种颜色之间的比例值, 其中0是当前颜色和1.0是第一个参数的颜色。

[method:Color multiply]( [param:Color color] )

将此颜色的RGB值乘以给定的 [page:Color color] 的RGB值。

[method:Color multiplyScalar]( [param:Number s] )

将此颜色的RGB值乘以给定的[page:Number s]的值。

[method:Color offsetHSL]( [param:Float h], [param:Float s], [param:Float l] )

将给定的 [page:Float h], [page:Float s], 和 [page:Float l]值加到当前颜色值。 内部的机制为:先将该颜色的 [page:.r r], [page:.g g] 和 [page:.b b] 值转换为HSL,然后与传入的[page:Float h], [page:Float s], 和 [page:Float l] 相加,最后再将结果转成RGB值。

[method:Color set]( [param:Color_Hex_or_String value] )

[page:Color_Hex_or_String value] - 用于设置该颜色的值。

有关 [page:Color_Hex_or_String value] 的详细信息,请参阅上面的构造函数。 根据输入类型,将会委托给 [page:.copy], [page:.setStyle], 或者 [page:.setHex] 函数处理。

[method:Color setHex]( [param:Integer hex] )

[page:Integer hex] — [link:https://en.wikipedia.org/wiki/Web_colors#Hex_triplet hexadecimal triplet] 格式。

采用十六进制值设置此颜色。

[method:Color setHSL]( [param:Float h], [param:Float s], [param:Float l] )

[page:Float h] — 色相值处于0到1之间。hue value between 0.0 and 1.0
[page:Float s] — 饱和度值处于0到1之间。
[page:Float l] — 亮度值处于0到1之间。

采用HLS值设置此颜色。

[method:Color setRGB]( [param:Float r], [param:Float g], [param:Float b] )

[page:Float r] — 红色通道的值在0到1之间。
[page:Float g] — 绿色通道的值在0到1之间。
[page:Float b] — 蓝色通道的值在0到1之间。

采用RGB值设置此颜色。

[method:Color setScalar]( [param:Float scalar] )

[page:Float scalar] — 处于0到1之间的值

将颜色的RGB值都设为该 [page:Float scalar] 的值。

[method:Color setStyle]( [param:String style] )

[page:String style] — 颜色css样式的字符串

采用ccs样式的字符串设置此颜色。例如, "rgb(250, 0,0)", "rgb(100%, 0%, 0%)", "hsl(0, 100%, 50%)", "#ff0000", "#f00", 或者 "red" ( 或者任何 [link:https://en.wikipedia.org/wiki/X11_color_names#Color_name_chart X11 color name] - 所有140种颜色名称都支持 ).
半透明颜色例如 "rgba(255, 0, 0, 0.5)" and "hsla(0, 100%, 50%, 0.5)" 也能支持, 但是alpha通道的值将会被丢弃。

注意,对于X11颜色名称,多个单词(如暗橙色)变成字符串“darkorange”。

[method:Color setColorName]( [param:String style] )

[page:String style] — 颜色名字的英文单词 ( 具体请查阅 [link:https://en.wikipedia.org/wiki/X11_color_names#Color_name_chart X11 color names] )

通过颜色名字设置该颜色。如果你不使用其他 CSS 颜色样式形式,那么这种方式会略快于 [page:.setStyle] 方法。

为了方便使用,颜色名称都可以通过 Color.NAMES 访问,例如:Color.NAMES.aliceblue // returns 0xF0F8FF

[method:Color sub]( [param:Color color] )

从该颜色的RGB分量中减去传入颜色的RGB分量。如果分量结果是负,则该分量为零。

[method:Array toArray]( [param:Array array], [param:Integer offset] )

[page:Array array] - 存储颜色的可选数组
[page:Integer offset] - 数组的可选偏移量

返回一个格式为[ r, g, b ] 数组。

源码(Source)

[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]