什么是 grabbbins
grabbbins 是一个 npm 包，用于从图片中提取色彩信息。它可以帮助前端开发人员更好地进行配色及美化设计。
安装
使用以下命令来安装 grabbbins：
npm install grabbbins --save
如何使用
使用 grabbbins，你需要传入一个图片 URL 或本地图片路径。你也可以设置选项并选择回调函数来处理提取的颜色信息。
-- -------------------- ---- -------
----- --------- - ---------------------
-- - --- ------
--------------------------------------------------
------------ -- -
-- ------
--
------------ -- -
---------------------
---
-- -----------
---------------------------------------------
------------ -- -
-- ------
--
------------ -- -
---------------------
---选项
grabbbins 支持以下选项：
count：提取的颜色数量，默认为 5。quality：图像采样质量，值为 1 至 100，默认为 10。filters：滤镜选项，可以是 "none"、"sepia"、"grayscale"、"blur" 或包含了多个选项的数组，默认为 "none"。
-- -------------------- ---- -------
-------------------------------------------------- -
------ --
-------- ---
-------- ---------
--
------------ -- -
-- ------
--
------------ -- -
---------------------
---示例代码
以下示例代码展示如何使用 grabbbins 和 Canvas 创建一个基本的颜色提取器：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
--------------------
-------
------
------ ----------- ----------------------------
------- ---------------------
------- ------------------------------------------------------
--------
----- ------ - ----------------------------------
----- --- - ------------------------
-------- ---------------- -
----- ----- - --- --------
------------ - -- -- -
------------ - ------------
------------- - -------------
-------------------- -- ---
----------------
--
--------- - -------------------------------------------
-
-------- --------------- -
----------------------------
------------ -- -
--------------------
--
------------ -- -
---------------------
---
-
---------
-------
-------这段代码创建了一个简单的 HTML 页面，允许用户上传本地图片。上传后，它将图片绘制在 Canvas 上，并使用 grabbbins 从中提取颜色信息。在控制台中可以看到颜色信息输出。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600556e981e8991b448d3c93