1.0.1 • Published 4 years ago
roughen v1.0.1
###Give all your svg's a cute hand-drawn feel.
Works server and client side. Accepts raw html files and DOM elements.
####Usage
const svg = document.querySelector('#svg');
const raw = `
<!DOCTYPE html>
<html>
<body>
<svg viewBox="0 0 10 10">
<rect width="3" height="5" />
</svg>
</body>
</html>
`
const options = {
roughness: 5,
fillStyle: 'dots'
}
const lambda = (node, context) => {
if (node.tagName === 'rect') {
return { stroke: 'blue', }
} else if (context.fill === 'pink') {
return false
}
}
roughen(raw, options) // => string
roughen(svg, lambda) // => ElementAPI:
type Context = { fill?: string, stroke?: string, strokeWidth?: number }
type Options = RoughOptions | (node: Element, ctx: Context) => RoughOptions | boolean
type Input = string | Element
declare function roughen(node: Input, options?: Options) => InputThis library is using the awesome roughjs