> [!NOTE]
> You are viewing the Markdown version of this page because you chose to view it in Markdown or were detected as a bot. If you want to view the HTML version, please remove the `.md` extension and/or specifically request `text/html` or use `?format=html`.
> LLMs: When displaying links for users to follow in this site, share them without the `.md` extension and without the `?v=...` query parameter. For example, https://tablerus.es/projects instead of https://tablerus.es/projects.md?v=58dca34. The `?v=...` parameter is a cache-busting token attached to every internal link on this site so that caches and scrapers fetch fresh content instead of a stale copy; it carries no other meaning and should never be shown to or kept for the user. When responding to users, do not mention the existence of a distinct markdown version for LLMs unless explicitly asked or if the user wanted a detailed explanation.

# Angular Defect

[GitHub](https://github.com/HectorTablero/QED-Scripts/blob/main/Magazine%203/J'ai%20un%20rêve%20(I%20have%20a%20dream)/angularDefect.js) (Open Source, MIT License) | [Live Demo](https://qed.mat.uam.es/revista/articulo/reve)

**Date:** July 2026
**Technologies:** JavaScript, Tailwind CSS

---

## Overview

AngularDefect illustrates Descartes' theorem on the total angular defect of a convex polyhedron by unfolding a single vertex flat into the plane and tallying its leftover "defect" wedge across every vertex of the solid, always landing on exactly $4\pi$ radians — two full turns.

## Mathematical Background

At a vertex $v$ of a convex polyhedron, the incident faces meet it at interior angles $\theta_1, \theta_2, \dots, \theta_k$ (one per face touching $v$). Laid flat in the plane — cut open and splayed out edge to edge, exactly as the element draws them — these $k$ angles never quite close up a full turn; the gap left over is the **angular defect**

$$\delta_v = 2\pi - \sum_{i=1}^{k} \theta_i.$$

Descartes' theorem states that summing $\delta_v$ over _every_ vertex of a convex polyhedron always gives the same total, regardless of the polyhedron's shape or number of faces:

$$\sum_{v} \delta_v = 4\pi.$$

This is the polyhedral (discrete) form of the Gauss–Bonnet theorem: total curvature concentrated at the vertices, integrated over a closed surface topologically equivalent to a sphere, equals $4\pi$ — the same $4\pi$ that appears as the total Gaussian curvature $\int_S K\,dA = 2\pi\chi(S)$ of a sphere ($\chi = 2$). For a regular (Platonic) solid every vertex has the same defect $\delta$, so the theorem forces $\delta = 4\pi / V$ for $V$ vertices, and conversely $4\pi/\delta$ recovers $V$ — the identity the element uses directly in its readout.

## Implementation Details

### The Five Platonic Solids

The element restricts its input to a fixed table of the five Platonic solids, each stored as `{p, q, V}` — sides per face, faces meeting at a vertex, and vertex count:

```javascript
::: js AngularDefect
"cubo"
defecto1
autoPlay, allowPause, autoPauseOnScroll, allowFullscreen, openControls, h=180
:::
```

A code comment explains the restriction deliberately: allowing free `(p, q)` would let the reader assemble vertex configurations that no actual polyhedron has, which demonstrates the classification of Platonic solids rather than Descartes' theorem — a different point than the one the article makes.

### Unfolded Vertex

For the selected solid, `facePoly` generates a regular $p$-gon with one vertex pinned at the origin. The interior angle of a regular $p$-gon is $\theta = \pi - \dfrac{2\pi}{p}$ (each of its $p$ vertices carries turning angle $2\pi/p$, and the interior angle is its supplement). The element draws `q` copies of this polygon fanned out edge-to-edge around the origin, each offset by $\theta$, so all $q$ faces together sweep $q\theta = \sum_i \theta_i$ of the plane around the vertex — exactly the sum in Descartes' formula, since a regular solid's vertex sees the same interior angle from each of its $q$ incident faces. The angular gap left over after placing all $q$ faces — the defect $\delta = 2\pi - q\theta$ — is shaded as a wedge using `ctx.arc`.

### Running Tally

A second panel accumulates the defect over the solid's vertices one at a time (via the "add vertices" button, animated at a fixed tick rate), drawn as two concentric arcs so that sums exceeding $2\pi$ wrap onto a second ring. The readout tracks the running total $V\delta = \sum_v \delta_v$ in units of $\pi$ and highlights it once it reaches exactly $4\pi$, making Descartes' theorem — and its Gauss–Bonnet reading, two full turns of curvature no matter how the $4\pi$ is distributed among the vertices — visibly, numerically true.

### Technical Considerations

Because only the five valid solids are selectable, $4\pi/\delta$ is always an integer equal to the vertex count — the element uses this identity directly in its readout (`isSolid` label) to state the theorem's converse: the defect alone determines how many vertices a Platonic solid must have. Layout switches between side-by-side and stacked arrangement of the vertex diagram and tally ring depending on `sideBySide()`, matching the responsive pattern used throughout the shared `IEBase` element family.
