本文へ移動

Chizu地図

SVGの地図を描き、地域を表示範囲に収め、番号付きの注記や地理クイズを英語と日本語の名前で作れます。

「地図」は、土地や場所を図で表したものです。 名前について(英語)

目次

リファレンス · 表示範囲・形・クイズの道具

CalloutRequest型

リファレンスの説明と例は英語です。見出しと目次は日本語です。

The region codes, framing window, radius, numbering and layout options for a callout sheet.

インポート

import type { CalloutRequest } from "@johnmorrisdotca/chizu";

定義

type CalloutRequest = {
    codes: readonly string[];
    box?: MapBox;
    radiusRatio?: number;
    polish?: boolean;
    keepOut?: CalloutKeepOut;
    numbering?: "given" | "west-to-east";
    features?: readonly Pick<ChizuFeature, "code" | "centroid">[];
};

メンバー

名前型説明
codesreadonly string[]

The regions to number. A region the window does not show is not numbered.

box (省略可)MapBox | undefined

The window the map is drawn in: circles are placed inside it. Default: the whole map.

radiusRatio (省略可)number | undefined

The circle's radius as a share of the window's width. Default 0.03.

polish (省略可)boolean | undefined

Finish with the slow pass that clears every near-miss: no two leaders closer than a circle's radius, no leader through another number, each leader leaving its region from the coast nearest its number. Worth its seconds on a sheet that is printed once; a map redrawn on every tap keeps to the quick walk. Default false.

keepOut (省略可)CalloutKeepOut | undefined

Lengths of the window's bottom-right corner to keep clear, in map units, for a credit line: up the right edge and along the bottom.

numbering (省略可)"given" | "west-to-east" | undefined

given numbers the regions in the order they were asked for; west-to-east numbers them as they run across the map. Default given.

features (省略可)readonly Pick<ChizuFeature, "code" | "centroid">[] | undefined

Named features that may be numbered too (a layer's features, or featuresShown of it): a code in codes that is not a region's is looked for here, and its leader starts where its name goes, in the sea for a sea, on the line for a river. The land the circles keep off is still the map's own.

例

import WORLD from "@johnmorrisdotca/chizu/world";
import { layoutCallouts, type CalloutRequest } from "@johnmorrisdotca/chizu";

const request: CalloutRequest = { codes: ["BR", "AR", "CL"], numbering: "west-to-east" };
console.log(layoutCallouts(WORLD, request).map((spot) => `${spot.number} ${spot.code}`).join(", "));
// 1 CL, 2 AR, 3 BR
1 CL, 2 AR, 3 BR

出力(このページを作ったときに実行した結果)

ソースを見るGitHub で編集@johnmorrisdotca/chizu 1.5.0 のソースから作成しました。

この日本語は、まだ日本語を母語とする方の確認を受けていません。訂正を歓迎します。