Repository files navigation

image-color-utils

基于欧式距离公式及图片色值量化算法提供 取色 色值相似度对比 色彩边界检测 等能力。

codesandbox

Install

npm install image-color-utils --save

Usage

import { ImageColorUtils } from 'image-color-utils'
commonjs
const { ImageColorUtils } = require('image-color-utils')
  • ImageColorUtils
  • pickColor
  • pickColors
  • adjust
  • compare
  • hex2rgb
  • rgb2hex
  • # ImageColorUtils

    import { ImageColorUtils } from 'image-color-utils'
    const params = {
      origin: img,
      width: canvas.width,
      height: canvas.height,
      boundaryValue,
      mockMovePx,
      onload,
    const imageColorUtils = new ImageColorUtils(params)
    Arguments
    Default required origin 数据源(可以是 http链接 / ImageBitmap / HTMLImageElement ) string / HTMLImageElement / ImageBitmap / width number false (不传参将根据图片宽高自适应,origin 为 ImageBitmap / HTMLImageElemen,必填) height number false (不传参将根据图片宽高自适应,origin 为 ImageBitmap / HTMLImageElemen,必填) mockMovePx 边界扫描距离(最大边界扫描距离, 扫描方向由内向外) number false boundaryValue 色彩边界阈值(作用于色值相似度对比, 阈值越高,相似条件越高) number false onload ()=>void false
    Returns
    const imageColorUtils = new ImageColorUtils({ origin: img, width: canvas.width, height: canvas.height const res = imageColorUtils.pickColor(x, y)
    Arguments
    Default required const imageColorUtils = new ImageColorUtils ( { origin : img , width : canvas . width , height : canvas . height const res = imageColorUtils . pickColors ( )
    Returns
    Returns
    import { ImageColorUtils } from 'image-color-utils'
    const imageColorUtils = new ImageColorUtils({ 
      origin: img,
      width: canvas.width, 
      height: canvas.height,  
      boundaryValue,
      mockMovePx
    imageColorUtils.adjust(leftTopPosition, rightBottomPosition)
    Arguments
    Default required
    import { ImageColorUtils } from 'image-color-utils'
    const res = ImageColorUtils.compare(color1, color2, boundaryValue, type)
    Arguments
    Default required
    import { ImageColorUtils } from 'image-color-utils'
    const imageColorUtils = new ImageColorUtils({ 
      origin: img,
      width: canvas.width,
      height: canvas.height,
      boundaryValue,
      mockMovePx
    console.log(imageColorUtils.canvas)
    console.log(imageColorUtils.ctx)
    console.log(imageColorUtils.imageData)