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

featureMapfunction

A layer as a map of its own: the same canvas, the features as its regions. Every function of the engine takes it, so a sea is framed with focusBox, asked about with findQuestion (its look-alikes are the seas next to it, then the rest of its group, then the nearest), and read from a paste with placesFromText.

Import it

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

Definition

function featureMap(map: ChizuMap, layer: Pick<ChizuFeatureLayer, "features">, choices?: readonly ChizuFeatureChoice[]): ChizuMap

Parameters

NameTypeDescription
mapChizuMap

The native map or map fields required by this signature; coordinates and region codes belong to its canvas.

layerPick<ChizuFeatureLayer, "features">

The native feature layer; its coordinates must match the map used for drawing.

choices (optional)readonly ChizuFeatureChoice[]

Native physical-feature groups, kinds, water or all selections.

Returns

ChizuMap

A layer as a map of its own: the same canvas, the features as its regions. Every function of the engine takes it, so a sea is framed with focusBox, asked about with findQuestion (its look-alikes are the seas next to it, then the rest of its group, then the nearest), and read from a paste with placesFromText.

Examples

import WORLD from "@johnmorrisdotca/chizu/world";
import { loadFeatures } from "@johnmorrisdotca/chizu/load";
import { featureMap, findQuestion, seededRandom } from "@johnmorrisdotca/chizu";

const water = featureMap(WORLD, (await loadFeatures("world"))!, ["water"]);
const caspian = water.regions.find((one) => one.name === "Caspian Sea")!;
const question = findQuestion(water, caspian.code, seededRandom(3))!;
console.log(water.id, question.choices.length, question.choices[question.answerIndex] === caspian.code);
// world-features 4 true
world-features 4 true

What it prints (run when this page was built)

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