-
-
Save nazt/ae37bd1b2a7e78bc86ab78aac76a67e4 to your computer and use it in GitHub Desktop.
canvas-sketch + canvas-sketch-util = penplot lines
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const canvasSketch = require('canvas-sketch'); | |
const { renderPaths, createPath, pathsToPolylines } = require('canvas-sketch-util/penplot'); | |
const { clipPolylinesToBox } = require('canvas-sketch-util/geometry'); | |
const Random = require('canvas-sketch-util/random'); | |
const settings = { | |
dimensions: [ 12, 12 ], | |
orientation: 'landscape', | |
pixelsPerInch: 300, | |
scaleToView: true, | |
units: 'cm' | |
}; | |
const sketch = ({ width, height, units }) => { | |
// Holds all our 'path' objects | |
// which could be from createPath, or SVGPath string, or polylines | |
const paths = []; | |
// Draw random arcs | |
const count = 2000; | |
for (let i = 0; i < count; i++) { | |
// skip some randomly | |
if (Random.gaussian() > 0) continue; | |
// setup arc properties randomly | |
const angle = Random.gaussian(0, Math.PI / 2); | |
const arcLength = Math.abs(Random.gaussian(0, Math.PI / 2)); | |
const r = ((i + 1) / count) * Math.min(width, height) / 1; | |
// draw the arc | |
const p = createPath(); | |
p.arc(width / 2, height / 2, r, angle, angle + arcLength); | |
paths.push(p); | |
} | |
// Convert the paths into polylines so we can apply line-clipping | |
// When converting, pass the 'units' to get a nice default curve resolution | |
let lines = pathsToPolylines(paths, { units }); | |
// Clip to bounds | |
const margin = 1.5; | |
const box = [ margin, margin, width - margin, height - margin ]; | |
lines = clipPolylinesToBox(lines, box); | |
// The 'penplot' util includes a utility to render | |
// and export both PNG and SVG files | |
return props => renderPaths(lines, props); | |
}; | |
canvasSketch(sketch, settings); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment