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

parseMapRingsfunction

The rings of one region's path, in the order it draws them, each with its own box.

Import it

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

Definition

function parseMapRings(path: string, transform?: InsetTransform | null): MapRing[]

Parameters

NameTypeDescription
pathstring

The native SVG outline path to parse.

transform (optional)InsetTransform | null | undefined

The native inset scale and translation to apply.

Returns

MapRing[]

The rings of one region's path, in the order it draws them, each with its own box.

Examples

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

// Two islands: two rings, each with its own box.
console.log(parseMapRings("M0,0L10,0L10,10Z M20,20L30,20L30,30Z").map((ring) => [ring.minX, ring.maxX]));
// [ [ 0, 10 ], [ 20, 30 ] ]
[ [ 0, 10 ], [ 20, 30 ] ]

What it prints (run when this page was built)

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