chalks

2019-03-15 admin

chalks是什么

什么是chalks,A set of handy tools on top of p5js

chalks使用教程帮助文档

Chalks

A thin library on top of p5js containing methods to manipulate points and draw figures. Chalks is fully compatible with p5js and just provides some handy tools to simplify the creation process by accessing the p5js canvas2d object.

Some of the components:

  • Simplified path object to define styles and define curves in a plain declarative way
  • Attractors
    • Butterfly curve
    • Hypocycloid
    • Rose
    • Rossler
    • Lorentz
    • Dejon
  • Points manipulation (subidivide, subchunks)
  • Layout: column points, row points
  • Grammars
  • Color handling: integration with Chromajs

Example

function setup() {
    ch = new Chalks({width: 1000, height: 1000, seed:4}, {fill:"c8c8c8"})
    points = ch.Attractors.dejon([500,550], -2.24, 0.43, -3.66, -8.23, 250, 3200)
}

function draw() {
    points.forEach(p => ch.path({fill:"red", alpha:random(), stroke:"black", strokeWidth:2}, 10).m(p).l(p, p.cadd(10)).draw())
    noLoop()
}

Installation

Copy the file chalks.min.js from /lib and add it to your index.html after your p5js import.

Example:

<script language="javascript" type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.1/p5.js"></script>
<script language="javascript" src="./chalks.min.js" type="text/javascript"></script>
<script language="javascript" src="_your_sketch_.js" type="text/javascript"></script>

本站文章除注明转载外,均为本站原创或编译。欢迎任何形式的转载,但请务必注明出处。

转载请注明:文章转载自 JavaScript中文网 [https://www.javascriptcn.com]

本文地址:https://www.javascriptcn.com/read-57734.html

文章标题:chalks

回到顶部