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

Interactive maps

import { … } from "@johnmorrisdotca/chizu/mount";

17.0 kB minified and gzipped, with everything it imports (measured with esbuild)

Chizu in a page: mountChizu draws a map into any element and lets a person look around it by touch, mouse and keyboard: drag to move, the buttons, wheel or a pinch to zoom in ten steps, a press to choose a region. The world pans round without stopping. A separate entry (@johnmorrisdotca/chizu/mount), so a server never loads any of it.

Exports

NameKindWhat it is
CHIZU_MAP_STYLEconstantTHE STYLE a mounted map wears, beside the drawing's own (CHIZU_STYLE): the frame the map sits in, the zoom buttons over its corner and the line a screen reader is told what was chosen on.
ChizuMounttypeThe mounted native map’s drawing updates, selected region, framing, loaded features and cleanup handle.
ChizuMountOptionstypeWhat a mounted map is told.
ChizuViewtypeWhere a mounted map is looking.
ensureChizuMapStylefunctionPut the style in the page once: in the document's head, or in the shadow root the host is in.
mountChizufunctionPuts a map in an element, to look at by touch, mouse and keyboard: drag to move it, the buttons, the wheel or a pinch to zoom in ten steps, a press to choose a region, the arrow keys and plus and minus.

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