react-color-wander

Live Demo

You can view the algorithm in real-time here:

https://sonaye.github.io/react-color-wander

In Chrome, you can right-click the canvas an "Save As" to get the full resolution.

Output

Here are a few examples.

Installation

yarn add react-color-wander

Usage

import Art from 'react-color-wander';

<Art
  ref={ref => (this.art = ref)}
  map={require('./map.png')}
  palette={['red,', 'green', 'blue']}
  // seed="259022"
  // height={600} // default = innerHeight
  // width={800} // default = innerWidth
/>;

// to start drawing
this.art.draw();

// to stop drawing
this.art.stop();

// to get drawing dataURL (image/png)
this.art.data();

// to get some metadata
this.art.metadata();

// to get a ref. to the canvas
this.art.ref();

Example

Available here.