Skip to content

Add self-contained Mandelbrot HTML renderer - #1678

Open
tiagonbotelho wants to merge 1 commit into
mainfrom
copilot/add-mandelbrot-renderer
Open

Add self-contained Mandelbrot HTML renderer#1678
tiagonbotelho wants to merge 1 commit into
mainfrom
copilot/add-mandelbrot-renderer

Conversation

@tiagonbotelho

@tiagonbotelho tiagonbotelho commented Aug 5, 2026

Copy link
Copy Markdown

Adds mandelbrot.html, a standalone, dependency-free HTML/canvas/JS Mandelbrot set viewer.

Features

  • Renders the Mandelbrot set on an HTML5 canvas with a smooth color gradient
  • Pan: click and drag
  • Zoom: mouse wheel, touch pinch, or double-click to zoom in on a point
  • Iteration count automatically increases as you zoom in for more detail
  • Chunked rendering via requestAnimationFrame keeps the UI responsive during redraws
  • Press R to reset the view
  • No build step, no dependencies \u2014 just open the file in a browser

Testing

Verified locally with a headless Chrome/Playwright script: confirmed the fractal renders correctly, and that zoom/pan interactions update the view as expected (screenshots attached in the session channel).


📚 Documentation preview 📚: https://bowtie-json-schema--1678.org.readthedocs.build/en/1678/

Adds mandelbrot.html, a standalone canvas-based Mandelbrot set viewer
with no build step or dependencies. Supports pan (drag), zoom (scroll
wheel, pinch, double-click), and adaptive iteration counts as you zoom
in, with chunked rendering via requestAnimationFrame to keep the UI
responsive.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Copilot AI review requested due to automatic review settings August 5, 2026 16:51

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Adds a new standalone mandelbrot.html page that renders the Mandelbrot set directly in the browser (no build tooling), with interactive pan/zoom controls and a small on-screen HUD.

Changes:

  • Introduces a self-contained HTML/CSS/JS Mandelbrot renderer using <canvas> and per-pixel iteration.
  • Implements pan (pointer drag), zoom (wheel / double-click), and touch pinch scaling.
  • Uses chunked rendering via requestAnimationFrame to keep redraws responsive.
Show a summary per file
File Description
mandelbrot.html New self-contained Mandelbrot canvas renderer with interactive navigation and chunked redraws.

Review details

Tip

Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

  • Files reviewed: 1/1 changed files
  • Comments generated: 3
  • Review effort level: Lite

Comment thread mandelbrot.html
Comment on lines +186 to +192
}

ctx.putImageData(imageData, 0, 0);
row = rowsEnd;
if (row < h) {
renderHandle = requestAnimationFrame(renderChunk);
}
Comment thread mandelbrot.html
Comment on lines +18 to +21
#canvas {
display: block;
cursor: grab;
}
Comment thread mandelbrot.html
Comment on lines +4 to +5
<meta charset="UTF-8">
<title>Mandelbrot Set Renderer</title>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants