Code Monkey home page Code Monkey logo

canvas-sketch-util's Introduction

canvas-sketch-util

Utilities for generative art in Canvas, WebGL and JavaScript.

This is designed to be used alongside the canvas-sketch toolset, but it is generic enough to work for various Node.js/Browser use cases.

Example

You can require each module individually, and grab only the necessary functions.

Some examples:

const math = require('canvas-sketch-util/math');

console.log(math.clamp(1.25, 0, 1));
// 1

Or by using destructuring to grab only a select few functions:

const { fract, lerp } = require('canvas-sketch-util/math');

console.log(fract(51.23));
// 0.23

console.log(lerp(0, 50, 0.5));
// 25

The random utility has been inspired by Unity3D, as well as other engines.

const random = require('canvas-sketch-util/random');

console.log(random.value());
// some random number between 0 (inclusive) and 1 (exclusive)

// Create a seeded random generator
const seeded = random.createRandom(25);

console.log(seeded.range(25, 50));
// some deterministic random number

console.log(seeded.shuffle([ 'a', 'b', 'c' ]));
// deterministically shuffles a copy of the array

Features

The following modules have been implemented:

  • math - Math & interpolation utilities
  • random - A random number generator
  • color - RGB and HSL color utilities
  • geometry - Utilities for geometry & shapes
  • penplot - Utilities for working with pen plotters (e.g. AxiDraw)
  • shader - A full-screen GLSL shader utility

The following are planned but not yet implemented:

  • tween - Tweening, easing & animation utilities

And more to come...

Install

Use npm to install.

npm install canvas-sketch-util --save

Docs

For full API documentation, see Documentation.

You can also see a few examples in ./test/examples.js.

License

MIT, see LICENSE.md for details.

canvas-sketch-util's People

Contributors

mattdesl avatar madjidtaha avatar jinksi avatar mamboleoo avatar pbeshai avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.