Skip to content

chakri68/pixel-drawing-sim

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

15 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Pixel Drawing Simulator

Experience a web-based platform that showcases rasterization techniques like DDA, Bresenham's, Boundary Fill, Flood Fill, Cohen-Sutherland, and more. Crafted with Webpack, TypeScript, CSS, and HTML.

Overview

  • Dual-Pane Interface: Split view with a CodeMirror editor on the left and an HTML5 Canvas on the right.

  • Customizable Pixel Dimensions: Tailor the pixel size to suit your visualization needs.

  • Execute & Render: Hit the "Run" button to execute JavaScript, generating pixel coordinates for canvas rendering.

  • Browser Console Integration: Leverage the browser's console for algorithm tweaks, file interactions, and more.

Demo

Try it out: Pixel Drawing Simulator.

Getting Started

  1. Clone the repo.
  2. Install dependencies via npm install.
  3. Kick off the dev server with npm run dev.

Contribution

I originally developed it for a Computer Graphics course. Open to contributions! Submit pull requests, report bugs, or propose enhancements.