如何通过JavaScript中的十六进制代码检索颜色的人名

本文概述

• 1.下载NTC.js
• 2.使用方法

在客户的所有奇怪需求中, 最怪异的肯定是设计师之一。最近, 我需要满足一个听起来很奇怪的要求, 即通过JavaScript中的十六进制代码来检测颜色的名称。最初, 经过一些研究, 我发现这项任务有多困难。幸运的是, 使用JavaScript进行的一些实现具有很大的潜力, 特别是Name That Color库。

在本文中, 我们将向你介绍如何轻松使用Color的JavaScript库Name。

1.下载NTC.js

你可以在此处从官方网站下载ntc.js脚本文件。使用NTC工具, 你将能够根据给定的代码和类中的寄存器猜测最接近的颜色。值得一提的是, 通过十六进制代码猜测颜色的技巧非常棘手, 对颜色命名的欣赏也可能会有所不同。但是, 原始的JS脚本会提供多种颜色, 这些颜色可能与你的十六进制代码匹配, 如果未在类中注册, 它将返回最接近的颜色。

有关此项目的更多信息, 请访问此处的官方网站。

2.使用方法

最初, 你只需要强制转换由该​​库创建的ntc对象的name方法, 该对象的初始化需要一点执行时间, 因为它将创建一个非常大的调色板, 用于将你的十六进制代码与可用数据进行比较。从实例中, 你将可以使用3种方法。我们感兴趣的只是name方法有用：

<!-- Include name that color library -->
<script type="text/javascript" src="ntc.js"></script>

<script type="text/javascript">
    // 1. You need a hex code of the color
    var ColorCode = "#008559";

    // 2. Rate the color using NTC
    var ntcMatch  = ntc.name(ColorCode);

    // 3. Handle the result. The library returns an array with the identified color.

    // 3.A RGB value of closest match e.g #01826B
    console.log(ntcMatch[0]);
    // Text string: Color name e.g "Deep Sea"
    console.log(ntcMatch[1]);
    // True if exact color match, a Boolean
    console.log(ntcMatch[2]);
</script>

此方法将以十六进制颜色代码为6或3位的字符串(例如#ffffff或#fff)作为第一个参数, 并返回一个数组, 该数组包含根据颜色猜测过程需要了解的数据。该数组分别包含3个项目：

• 0：该类中最接近的颜色的十六进制颜色。
• 1：颜色的人名。
• 2：布尔值, 用于确定颜色代码是否与名称完全相同。

你要查找的属性是名称键, 该键返回十六进制颜色代码的人名, 在这种情况下为”深海”颜色, 但是它几乎适用于你提供的每种十六进制颜色, 以防万一使用你的颜色, 你将收到具有相同3个项目的数组, 但是具有以下值：

• 0：＃000000。
• 1：无效的颜色：$ yourHexCodeString。
• 2：假

编码愉快！