> [Wiki](Home) ▸ [[API--中文手册]] ▸ [[核心函数]] ▸ *颜色* * 如发现翻译不当或有其他问题可以通过以下方式联系译者: * 邮箱：zhang_tianxu@sina.com * QQ群：[D3数据可视化](http://jq.qq.com/?_wv=1027&k=ZGcqYF)205076374，[大数据可视化](http://jq.qq.com/?_wv=1027&k=S8wGMe)436442115 实现可视化要经常和颜色打交道。虽然你的电脑显示屏懂得很多的颜色，但这对通过js来配置颜色帮助不大。所以d3提供多种颜色空间的表示，包括 RGB， HSL，LAB 和 HCL，可实现规范、插值、转换和操作（例如颜色的明暗）。 注意：虽然你可以直接操作颜色，当时也需要参考一下D3对于interpolateRgb, interpolateHsl 和 scales等内置颜色插值的实现。 如果你想查阅调色盘，请查阅ordinal scales 。 RGB # d3.rgb(r, g, b) 通过输入的参数r, g 和 b，创建一个RGB类型颜色对象。参数必须是在0-255之间的整数。你可以通过访问返回的颜色对象的r, g 和 b属性值来获取参数r, g, b的值。 # d3.rgb(color) • rgb decimal - "rgb(255,255,255)" • hsl decimal - "hsl(120,50%,20%)" • rgb hexadecimal - "#ffeeaa" • rgb shorthand hexadecimal - "#fea" • named - "red", "white", "blue" 通过解析输入的字符串参数，创建一个RGB类型颜色对象。如果参数 color 不是一个字符串，参数就会被强制类型转换为字符串类型。因此，该构造函数可以用来创建一个已经存在的颜色对象的副本，或者是将d3.hsl强制类型转换为RGB。字符串参数可以有多种形式： • rgb十进制- "rgb(255,255,255)" • hsl十进制- "hsl(120,50%,20%)" • rgb十六进制- "#ffeeaa" • rgb简写十六进制- "#fea" • 名称 - "red", "white", "blue" 输出的颜色将以红、绿和蓝的整数通道形式存储（整数范围：[0,255]）。颜色通道可以通过颜色对象的属性 r, g 和 b 访问到。可支持的列表named colors可以通过CSS指定。如果是HSL空间的颜色，可以转换成在RGB空间相同类型的值，和 hsl.rgb类似。 # rgb.brighter([k]) 返回颜色的一个高亮副本。每个颜色通道值将乘以0.7 ^ -k. 如果参数 k 被忽略，将使用默认值1。通道值上限值255，下限值30. # rgb.darker([k]) 返回低颜色的一个亮度副本。每个颜色通道值将乘以0.7 ^ k. 如果参数 k 被忽略，将使用默认值1。 # rgb.hsl() 返回一个HSL空间的等值颜色对象。请查阅 d3.hsl 了解更多关于返回颜色对象的信息. 文档 CSS3 Color Module Level 3中有关于RGB到HSL转换的信息。该函数是上述转化的逆操作。 # rgb.toString() 将RGB颜色转换成一个十六进制数的字符串，如 such as "#f7eaba"。 HSL # d3.hsl(h, s, l) 通过输入的参数h, s和l，创建一个HSL颜色对象。创建新的HSL颜色，通过指定的色度h，饱和度s和亮度l。其中色度h取值范围[0,360]。饱和度和亮度取值范围 0,1。你可以通过访问返回的颜色对象的h, s 和l 属性值来获取颜色的通道属性. # d3.hsl(color) • rgb decimal - "rgb(255,255,255)" • hsl decimal - "hsl(120,50%,20%)" • rgb hexadecimal - "#ffeeaa" • rgb shorthand hexadecimal - "#fea" • named - "red", "white", "blue" 通过解析输入的字符串参数，创建一个HSL类型颜色对象。如果参数 color 不是一个字符串，参数就会被强制类型转换为字符串类型。因此，该构造函数可以用来创建一个已经存在的颜色对象的副本，或者是将d3.rgb强制类型转换为HSL。字符串参数可以有多种形式： • rgb十进制- "rgb(255,255,255)" • hsl十进制- "hsl(120,50%,20%)" • rgb十六进制- "#ffeeaa" • rgb简写十六进制- "#fea" • 名称 - "red", "white", "blue" 输出的颜色将以取值范围为[0,360]的色度和取值范围为[0,1]的亮度、饱和度作为属性值存储。红、绿和蓝的整数通道形式存储（整数范围：[0,255]）。颜色通道可以通过颜色对象的属性h, s和l访问到。可支持的列表named colors可以通过CSS指定。如果是RGB空间的颜色，可以转换成在HSL空间相同类型的值，和rgb.hsl类似。 # hsl.brighter([k]) 返回颜色的一个高亮副本。每个颜色通道值将乘以0.7 ^ -k. 如果参数 k 被忽略，将使用默认值1。通道值上限值255，下限值30. # hsl.darker([k]) 返回低颜色的一个亮度副本。每个颜色通道值将乘以0.7 ^ k. 如果参数 k 被忽略，将使用默认值1。 # hsl.rgb() 返回一个RGB空间的等值颜色对象。请查阅d3.rgb了解更多关于返回颜色对象的信息. 文档CSS3 Color Module Level 3中有关于HSL到RGB 转换的信息。该函数是上述转化的逆操作。 # hsl.toString() 将颜色转换成一个十六进制数的RGB颜色字符串，如 such as "#f7eaba"。 HCL # d3.hcl(h, c, l) … # d3.hcl(color) … # hcl.brighter([k]) … # hcl.darker([k]) … # hcl.rgb() … # hcl.toString() 将颜色转换成一个十六进制数的RGB颜色字符串，如 such as "#f7eaba"。 L*a*b* # d3.lab(l, a, b) … # d3.lab(color) … # lab.brighter([k]) … # lab.darker([k]) … # lab.rgb() … # lab.toString() 将这个L*a*b*颜色转换成一个十六进制数的RGB颜色字符串，如 such as "#f7eaba"。 Color 提供d3.color的基础类型，支持你扩展D3增加行的颜色空间。这个类型能够自动地使用 d3.interpolate（通过instanceof d3.color识别）插入RGB。 # d3.color() 颜色类型的基础构造函数。 # color.rgb() 返回这个颜色的RGB值，必须被所有的颜色空间实现。 # color.toString() 转换为代表这个颜色的RGB十六进制字符串，例如"#f7eaba"。 边城译2014-4-6 咕噜校20141122