桥口

产生一个美丽的代表 任何大麻.

安装

安装方式 :

$ npm install @emeraldpay/hashicon --save

使用量

东西,你想代表视觉。 例如屏幕上对象的ID.

// 
const value = "9dddff8f-be81-4c27-80c8-099327865f3f";

创建一个 hashicon 默认参数 :

import { hashicon } from 'hashicon';

const icon = hashicon(value); // icon is a <canvas> element
const icon = hashicon(value, 80);  // size 80px

或者,通过习惯 段落数字 :

const params = {...};
const icon = hashicon(value, params);

最后,附上新创建的 hashicon 至 HTML 文档:

document.body.appendChild(icon);

参数

见 默认参数

HashIcon的值从散列中取出,并用以下参数来控制来操纵可能的视觉输出: 1

{

// hasher for the input value. "blake2" is default 
// can also be "keccak" (or "legacy"), at this case add dependency to "js-sha3" package
hasher: "blake2",

// size px (HiDPI/Retina aware)
size: 100,

// primary color range radius ( 0=red, 60=yellow, 120=green, ..., 360=red )
hue: { min: 0, max: 360 },

// saturation ( 0=grey, 100=colorfull )
saturation: { min: 70, max: 100 },

// lightness ( 0=extremlydark, 50=optimal, 100=extremlybright )
lightness: { min: 45, max: 65 },

// hue variation for individual triangles
variation: { min: 7, max: 14, enabled: true },

// color shift from primary hue to secondary hue ( the pattern )
shift: { min: 60, max: 300 },

// the pattern opacity
figurealpha: { min: .7, max: 1.2 }, // alpha

// simulate a 3d cube by different areas gets some more/less light applyed 
light:{ top:10, right:-8, left:-4, enabled: true},

// Allows a custom canvas to be used to render into
createCanvas: (width, height) => HTMLCanvasElement

}