凯时AG百家乐
图片索要主题色的用具库，不错兑现一些酷炫的界面后果。
本文不是 AI 生成，大部分笔墨齐是我我方敲键盘，部分笔墨摘自 autohue.js 作家主页，请诸位释怀知足阅读。
autohue.js 简介
autohue.js 是一个图片背鼎沸索要库，基于冷落来的神气，不错兑现好多看起来相比惊艳的后果。
主邀功能
索要图片的主题色和次主题色，也等于面积占比最大的两个神气值；
索要图片四边神气（即图片角落神气，渐变时，需要角落神气来诞生背鼎沸）
索要到主题色有什么作用？
卡片、海报中的神气遮罩
多年过去，卡片式绸缪很流行，我在责任上就接到一个需求，UI 绸缪师作念的是大图卡片式绸缪，条款在图片上表露标题和案牍实质，笔墨的底色要乞降封面图接近，最佳是如鱼得水。姿色是煞白的，于是绸缪师就把她“抄”的原界面发给我看，我差点没吐血…
AppStore 的大图海报界面
好家伙，苹果的 AppStore 首页的海报大图如实颜面，但其时是真不好兑现，终末怎么悉力兑现的也忘了。旨趣很简陋，等于索要图片的主题色，然后用透明度、高斯迂缓再加上投影等口头，就不错作念出访佛的后果。
图片和配景交融
在自适应绸缪的轮播图功能里，终点是为适配超宽表露器，AG真人百家乐线路轮播图的图移时常宽度不够，这时间索要轮播图四边的神气，就不错兑现图片和网页配景交融，访佛底下的后果：
配景交融后果
借助今天先容的 autohue.js，就不错很粗拙兑现。
开荒上手
安设
pnpm i autohue.js
使用例子
import autohue from 'autohue.js'// promise 化调用autohue(url, { threshold: { primary: 10, left: 1, bottom: 12 }, maxSize: 50}) .then((result) => { // 得到到主题色、次主题的以及四边的神气值 console.log(`%c${result.primaryColor}`, 'color: #fff; background: ' + result.primaryColor, 'main') console.log(`%c${result.secondaryColor}`, 'color: #fff; background: ' + result.secondaryColor, 'sub') console.log(`%c${result.backgroundColor.left}`, 'color: #fff; background: ' + result.backgroundColor.left, 'bg-left') console.log(`%c${result.backgroundColor.right}`, 'color: #fff; background: ' + result.backgroundColor.right, 'bg-right') console.log(`%clinear-gradient to right`, 'color: #fff; background: linear-gradient(to right, ' + result.backgroundColor.left + ', ' + result.backgroundColor.right + ')', 'bg') bg.value = `linear-gradient(to right, ${result.backgroundColor.left}, ${result.backgroundColor.right})` }) .catch((err) => console.error(err))
参数阐述
参数名
阐述
threshold
簇阈值，即取均色时的领域大小，一般在 8-12 傍边，推选默许 10 即可。当需要取精确角落神气时，不错单独诞生 left \ right 等 为 1，守旧两种模范：number | { primary?: number; left?: number; right?: number; top?: number; bottom?: number }
maxSize
降采样后的图片大小，如传入 100，图片将被压缩到最长边是 100，另一边等比例缩放，值越小处置速率越快，然则精度会越低。
之前我也用过访佛的神气索要库，但会碰到一个问题，在手机表露的图片分袂率时时齐很高，索要神气需要遍历统共的像素点，这时间会颠倒残害性能，严重的时间甚而会形成卡顿。而 autohue.js 不错在处置前通过 maxSize 先裁减采样率，大大升迁了索要速率，性能很好。
免费开源阐述
autohue.js 是一个免费开源的 JS 图片神气索要用具库凯时AG百家乐，神气源码罗致 MIT 开源公约托管在 Github 上，咱们不错免费下载来使用，也不错用在买卖神气中。