C O L O R − R A N G E R
renders a color range for a color in rectangular or polar coordinate system by manipulating ImageData’s buffer. It is primarily needed for building color pickers.
Use
var colorRanger = ; //create a canvasvar canvas = document;canvaswidth = 50;canvasheight = 50;var context = canvas;var imageData = context; //renderimageDatadata = colorRanger; //put image data back to canvascontext;documentdocumentElementstylebackground = 'url(' + canvas + ') 0 0 / cover';
API
ranger.render(color, buffer, options)
Render rectangular or polar range into an imageData’s buffer. Size of the final image is taken such that it fills the whole imageData area.
Parameter | Type | Description |
---|---|---|
color |
Array | An array of input values, defined in sourceSpace - rgb by default. |
buffer |
Uint8ClampedArray | An imageData.data object to which render the range. |
options.space |
string | A color space name for the range taken from the color-space module. E. g. 'hsl' . |
options.channel |
Array | An array of x/y space channel indexes. E. g. [0,2] from 'hsv' are hue and value channels. One of the channels can be omitted, e. g. [null, 1] means render saturation by y-axis. |
options.min , options.max |
Array | Arrays of left and right values for the range, corresponding to the channels in x/y axis. |
options.type |
String | Render whether polar , rect or chess . |
options.sourceSpace |
String | If you have color in a space different from rgb , pass the sourceSpace. |
ranger.chess(colorA, colorB, buffer)
Render a chess grid, useful for transparency grid image rendering. Grid size is automatically figured out from the imageData
size.
Parameter | Type | Description |
---|---|---|
colorA |
Array | Black cell color. |
colorB |
Array | White cell color. |
buffer |
Uint8ClampedArray | An ImageData object into which to render grid. |
require('color-ranger/worker')
Return worker for workerify, able to render range in a background.
var work = ;var worker = ; worker; worker;
Worker gets all the parameters of .render
, with additional option id
, an id of request to identify in response.