offcircle

v3.0.2
Recreation of Matplotlib ellipse demo
ellipse matplotlib canvas art generative python

offcircle

Logo
JavaScript Generative Art
A recreation of the Matplotlib Ellipse Demo in JavaScript

Installation

npm install offcircle

API

The offCircle function operates on the Canvas API (node & browser).

  1. ctx = 2D canvas context to render on
  2. ellipseCount = Number of ellipses to render on the canvas (defaults to 120)

returns Void

offCircle(ctx,ellipseCount)

Usage

Node

import fs from 'fs'
import path from 'path'
import Canvas from 'canvas'
import offCircle from 'offcircle'

// or common js

var fs = require('fs')
var path = require('path')
var Canvas = require('canvas')
var offCircle = require('offcircle')

var canvas = Canvas.createCanvas(500, 500)
var ctx = canvas.getContext('2d')
offCircle(ctx, 120)

var out = fs.createWriteStream(path.join(__dirname, '/example.png'))
var stream = canvas.createPNGStream()
stream.on('data', function (chunk) {
  out.write(chunk)
})

Web (React)

import React, { useEffect } from 'react';
import './App.css';
import offCircle from "offcircle";

function App() {
  const canvasRef = React.useRef(null);
  useEffect(()=> {
    const canvas = canvasRef.current
    const ctx = canvas.getContext('2d')
    offCircle(ctx,1000)
  })
  return (
    <div className="App">
    <canvas
      ref={canvasRef}
      width={window.innerWidth}
      height={window.innerHeight}
    />
    </div>
  );
}

export default App;

License

MIT

Original Matplotlib Python Demo

Ellipse Demo

npm i offcircle

Metadata

  • MIT
  • >=12
  • Andrew Moss
  • released 4/19/2020

Downloads

Maintainers