Skip to the content

Chizu地図

Draw SVG maps, frame regions, place numbered callouts and build geography quizzes with English and Japanese names.

Chizu is the Japanese word 地図 for map. About the name

Contents

Reference · Framing, geometry and quiz tools

HANDLE_SLOTSconstant

Positions a handle will try, in order, measured in radii from the centroid.

Straight above is the ordinary answer and straight below was the whole of the fallback, which is one position more than none: it was added for two small provinces whose handles landed in the same few pixels, and it fixed exactly that pair. A third crowded region found both taken and went back on top of the first.

Every vertical slot is tried before any sideways one, which is not about looks. The handles are numbered west to east so they read as a row, and a handle shoved sideways can cross the one it was supposed to follow - moving it up or down instead keeps the numbers in the order the player reads them. Sideways is still there for the cluster that runs out of column.

Import it

import { HANDLE_SLOTS } from "@johnmorrisdotca/chizu";

Definition

const HANDLE_SLOTS: readonly (readonly [number, number])[] = [
    [0, -2.1],
    [0, 2.1],
    [0, -4.4],
    [0, 4.4],
    [0, -6.7],
    [0, 6.7],
    [-1.9, -1.5],
    [1.9, -1.5],
    [-1.9, 1.5],
    [1.9, 1.5],
    [-2.6, 0],
    [2.6, 0],
]

Examples

import { HANDLE_SLOTS } from "@johnmorrisdotca/chizu";

// Where a number may sit, in radii from its region's centre, nearest first.
console.log(HANDLE_SLOTS.length, HANDLE_SLOTS[0]);
// 12 [ 0, -2.1 ]
12 [ 0, -2.1 ]

What it prints (run when this page was built)

View sourceEdit on GitHubMade from the source of @johnmorrisdotca/chizu 1.5.0.