Skip to content
Helps produce common dithering patterns
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
example
LICENSE
index.js
index.mjs
matrix.mjs
package.json
readme.md
test.js

readme.md

3-bit web worker friendly implementation of common dithering algorithms, ordered and spatial

Setup

# Fetch latest from github
npm i thewhodidthis/dither

Usage

import { spatial as bender } from '@thewhodidthis/dither'

const source = document.createElement('img')
const target = document.createElement('canvas').getContext('2d')

const canvas = Object.assign(target.canvas, { width: 180, height: 180 })

// The Floyd/Steinberg variety is default
const filter = bender()

source.addEventListener('load', () => {
    target.drawImage(source, 0, 0)

    const pixels = target.getImageData(0, 0, canvas.width, canvas.height)
    const result = filter(pixels)

    target.putImageData(result, 0, 0)

    document.body.appendChild(canvas)
})

source.setAttribute('crossOrigin', 'anonymous')
source.setAttribute('src', `//source.unsplash.com/random/${canvas.width}x${canvas.height}`)

References

You can’t perform that action at this time.