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.