Skip to content

🎨 Universal canvas framework for Node.js and browser with multi-layout architecture. Personal use only - Commercial license required.

License

Notifications You must be signed in to change notification settings

NeaByteLab/NeaCanvas

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

4 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

🎨 NeaCanvas ✨

Version License Node TypeScript

⚠️ ALPHA VERSION 0.1.3 - NOT FOR PRODUCTION USE

Universal canvas framework for Node.js and browser environments with TypeScript support.

Personal Use Only - Commercial license required for business/production use. See LICENSE for details.

πŸš€ Features

  • 2D Graphics: Comprehensive drawing primitives and tools
  • Universal Runtime: Works in Node.js and browser environments
  • TypeScript: Full TypeScript support with strict typing
  • Performance: Optimized rendering with NeaSmart batching and caching
  • Extensible: Plugin architecture for custom functionality
  • Export Support: PNG, JPEG, SVG, and PDF export

πŸ“¦ Installation

GitHub Release Only (Not yet published to npm)

# Clone from GitHub
git clone https://github.com/NeaByteLab/NeaCanvas.git
cd NeaCanvas
npm install
npm run build

# Or install directly from GitHub
npm install github:NeaByteLab/NeaCanvas

πŸš€ Quick Start

import { NeaCanvas } from './src/index' // Local development
// or
import { NeaCanvas } from '@neabyte/canvas' // After GitHub install

// Create canvas instance
const canvas = NeaCanvas.init({
  width: 800,
  height: 600,
  backgroundColor: '#ffffff'
})

// Create a layout
const layout = await canvas.create('main', {
  width: 600,
  height: 400,
  x: 100,
  y: 100
})

// Draw shapes on the layout
layout.draw('rectangle', {
  x: 0,
  y: 0,
  width: 200,
  height: 100,
  fill: '#ff6b6b'
})

layout.draw('circle', {
  x: 300,
  y: 150,
  radius: 80,
  fill: '#4ecdc4'
})

layout.draw('text', {
  x: 50,
  y: 200,
  text: 'Hello NeaCanvas!',
  fill: '#2d3436',
  fontSize: 24
})

// Render in browser
canvas.render()

// Export as image
const pngData = await canvas.export({ format: 'png', quality: 0.9 })

βš™οΈ Requirements

  • Node.js 20.0.0 or higher
  • TypeScript 5.9.0 or higher

🎯 Examples

Check out the /example directory for complete examples:

  • cert-generator-1.ts - Professional certificate generation
  • cert-generator-2.ts - Creative diagonal certificate
  • bar-chart-1.ts - Business dashboard with charts
  • website-ui-demo.ts - Multi-layout website UI
  • multi-layout-demo.ts - Basic multi-layout concept

πŸ”„ Development Status

  • βœ… Core framework architecture
  • βœ… Multi-layout system with auto-flush
  • βœ… Comprehensive validation system
  • βœ… Universal Node.js + Browser support
  • βœ… Export system (PNG, JPEG, SVG, PDF)
  • 🚧 Animation system with easing functions (in development)
  • 🚧 Advanced examples (expanding)
  • 🚧 Interactive web features (planned)
  • 🚧 3D rendering capabilities (planned)
  • 🚧 WebGL GPU integration (planned)
  • 🚧 Performance optimizations (in progress)
  • 🚧 Advanced examples (expanding)
  • 🚧 Plugin system (planned)

πŸ“„ License

Personal Use Only - See LICENSE for complete terms.

For commercial, production, or business use, contact us for a commercial license:

πŸ“ž Contact & Support


⚑ Built with TypeScript, designed for enterprise, licensed for personal use.

About

🎨 Universal canvas framework for Node.js and browser with multi-layout architecture. Personal use only - Commercial license required.

Topics

Resources

License

Stars

Watchers

Forks