← All projects

Science

G-maps mini-course

Darts, involutions and orbits, with an interactive cube and a quiz.

Done Sprint S15+S40 · 7 points
In short, no jargon for non-developersRead the summaryClose
What it is
A short interactive course on “generalised maps”, the way of representing 3D objects studied in my thesis, with a cube to explore and a quiz.
What it is for
To explain a specialised research topic simply.
What it shows
Teaching: I have taught at university, and I can make my own research field accessible.

Teaching and PhD topic

Source code

How the pieces fit together

Diagram: Construction → Library (steps) ; Tests → Library (χ, orientability, borders) ; Library → Drawing ; Drawing → Course ; Texts → Course (explain). steps χ, orientability, borders explain Construction decompose.js, step by step Library gmap.js, involutions Tests node:test Drawing SVG, α0 α1 α2 links Course project page Texts course.json, FR and EN

Mini-course: generalized maps

Six short lessons on the structure of my thesis, an unfolded cube to explore dart by dart, and a quiz to check.

1. Darts rather than vertices

A classic mesh stores vertices, edges and faces. A generalized map (G-map) stores something else: darts. Each face is cut into its sides, then each side into two halves, one at each end: each half is a dart.

A square has 4 sides, so 8 darts. The cube has 6 square faces: its G-map has 6 × 8 = 48 darts. They are the short segments in the figure below; the dot marks the end, that is the vertex, the dart belongs to.

2. Three links, α0, α1 and α2

Darts are linked in pairs, and each link changes exactly one thing. α0 links the two darts of a side: same face, same edge, other vertex. α1 links, at a vertex, the darts of two consecutive sides: same face, same vertex, other edge. α2 links the darts of two neighbouring faces: same edge, same vertex, other face.

Each αi is an involution: applying it twice gives the starting dart back, αi(αi(d)) = d. A dart without an α2 partner is linked to itself: it is "2-free", and it marks a boundary of the surface. The cube is closed: none of its darts is free.

The object.

The object. Two squares sharing an edge: 2 faces, 7 edges, 6 vertices. Its G-map is built dimension by dimension.

Dimension 0 → 1: α0.

Dimension 0 → 1: α0. Each side of each face becomes two darts, one per end; an α0 link (short black stroke) joins the two halves of the same edge. The shared edge still shows twice, once per face: 16 darts, 8 α0 links.

Dimension 1 → 2: α1.

Dimension 1 → 2: α1. In each face, the two darts meeting at a corner are linked by α1 (red arc around the vertex). Each face closes up: α0, α1, α0, α1… goes round it. 8 α1 links.

Dimension 2: α2.

Dimension 2: α2. The two faces are sewn along the edge they share: α2 (blue double stroke) links each dart of that edge to the dart of the other face at the same vertex. 2 α2 links; the 12 darts of the boundary stay free for α2.

The G-map.

The G-map. Sixteen darts and their α0, α1, α2 links: nothing else is stored. Vertices, edges and faces come back as orbits (6 vertices, 7 edges, 2 faces), and χ = 6 − 7 + 2 = 1, that of a disc.

Key, as in textbooks: α0 a short black stroke between the two darts of an edge, α1 a red arc at the corner, α2 a blue double stroke between two faces.
Net of the cube: six squares, each with its 8 darts, and the letters a to h of the cube's vertices.TopefbaLefteadhFrontabcdRightbfgcBackfehgBottomdcgh
The unfolded cube: each segment is a dart, the dot marks its vertex; α0 in black, α1 in red, α2 in blue (between squares next to each other in the net; click a dart to see all its links). The same letter is the same vertex of the cube.

Click a dart, or use the α buttons to move.

3. A consistency constraint

Links are not placed at random. Take an edge of face A, from vertex v to vertex w, and a dart d of A at v; its neighbour α0(d) is at w. If α2 sews d to the dart d' of face B, the edge must be sewn in one piece: the other end too, α2(α0(d)) = α0(d'). Since d' = α2(d), this reads α2 α0 = α0 α2: going to the end of the edge then changing face, or changing face then going to the end, leads to the same dart.

The involution follows. Replacing α2 α0 with α0 α2 in the middle, α0 α2 α0 α2 = α0 α0 α2 α2, and each αi applied twice cancels out: the cycle comes back to the starting dart. Conversely, if α0 α2 is an involution, it is its own inverse, α2 α0: the two statements are equivalent. What they forbid is an edge sewn to B at one end and to another face, or to nothing, at the other. A boundary is still allowed, as long as it is free at both ends.

The rule only holds for α0 and α2, which are not consecutive. α0 α1 moves one vertex round a face: on a square it takes four steps, not two, to come back. α1 α2 turns round a vertex: three steps on the cube.

The project's library checks these constraints on every dart; a map that breaks them is not a G-map.

4. Cells are orbits

Vertices, edges and faces are not stored: they are found by following some of the links. The ⟨α1, α2⟩ orbit of a dart, every dart reached using only α1 and α2, is a vertex. The ⟨α0, α2⟩ orbit is an edge, the ⟨α0, α1⟩ orbit a face, and ⟨α0, α1, α2⟩ the whole connected component.

In the cube, a vertex gathers 6 darts (3 faces meet there, 2 darts each), an edge 4, a face 8. Pick a dart in the figure and show its orbits.

5. Counting to understand the shape

Counting orbits gives the Euler characteristic: χ = V − E + F. For the cube, 8 − 12 + 6 = 2, as for any surface without holes; a torus gives 0. With the number of components and boundaries, it gives the genus, the number of "holes".

G-maps also represent non-orientable surfaces. A surface is orientable when its darts can be coloured in two colours so that every link joins two different colours. On the Moebius strip it cannot be done: going once round the strip comes back to the starting colour.

6. Why it is useful

Each dart knows its direct neighbours: many topological computations are local, dart by dart, hence parallel. G-maps extend to dimension 3 (with α3, for volumes) and beyond without changing their principle.

In my thesis, this formalism was used to analyse the topology of meshes of the cerebral vascular tree, from local information computed in parallel.

Quiz

1. How many darts does the cube's G-map have?
2. Which orbit is a vertex in dimension 2?
3. A dart d with α2(d) = d means…
4. Which composition must be an involution too?
5. What is the Euler characteristic of a torus?
6. Is the Moebius strip orientable?

Tech stack

  • JavaScript
  • SVG

Who does what

JavaScript
The 2D generalized map library (darts, involutions, orbits, invariants) and the interactive course with its quiz.
SVG
The course's figures: decomposition into darts, α0, α1 and α2 links, highlighted orbits.

Definition of Done

  • Code reviewed, diff by diff
  • Unit and integration tests green
  • Green CI on Linux, Windows and macOS when compiled
  • README, REVIEW.md and DECISIONS.md up to date
  • Texts in French and English
  • Demo deployed and tested on mobile