# bonsai

**Repository Path**: mirrors_leecade/bonsai

## Basic Information

- **Project Name**: bonsai
- **Description**: BonsaiJS is a graphics library and renderer
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-08-09
- **Last Updated**: 2026-02-07

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Bonsai

(previously known as *bikeshedjs*)

 > *The art of bonsai tells a story through living illusion. A bonsai artist searches for ways to express his personal creativity by mixing form and thought in a miniature world.* [*[source]*](http://whatijustlearned.wordpress.com/2011/04/22/bonsai-heaven-and-earth-in-one-container/)

### Introduction

Bonsai is a JavaScript graphics library. For the finer details, see the [documentation](http://docs.bonsaijs.org) (currently in construction).

Bonsai's main features include:

 * Architecturally separated runner and renderer
 * iFrame, Worker and Node running contexts
 * Shapes
 * Paths
 * Assets (Videos, Images, Fonts, SubMovies)
 * Keyframe and regular animation (easing functions too)
 * Shape/path morphing
 * *and much more*...

### An example

Draw a `100x200` rectangle to the stage at `{0,0}`:

```js
var r = new Rect(0, 0, 100, 200).addTo(stage);
```

Fill it:

```js
r.fill('red');
```

Change your mind... make it darker:

```js
r.fill( color('red').darker() );
```

Animate it:

```js
r.animate('400ms', {
  x: 50,
  y: 50,
  width: 200
});
```

See more here: [Bonsai Documentation/Overviews](http://docs.bonsaijs.org).