`ChizuMountOptions`型

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

What a mounted map is told. Everything but map may be changed later with set.

インポート

import type { ChizuMountOptions } from "@johnmorrisdotca/chizu/mount";

定義

type ChizuMountOptions = {
    map: ChizuMap;
    language?: ChizuLanguage;
    zoom?: MapZoom;
    tones?: Readonly<Record<string, string>>;
    colors?: Readonly<Record<string, string>>;
    callouts?: ChizuDrawOptions["callouts"];
    labels?: ChizuDrawOptions["labels"];
    selected?: string | null;
    fit?: boolean;
    selectable?: boolean;
    controls?: boolean;
    onSelect?: (code: string | null) => void;
    detail?: ChizuMap | (() => Promise<ChizuMap>);
    detailFrom?: MapZoom;
    onView?: (view: ChizuView) => void;
    features?: readonly ChizuFeatureChoice[];
    featureLayer?: ChizuFeatureLayer | null | ((mapId: string) => Promise<ChizuFeatureLayer | null>);
    featureLabels?: boolean;
};

メンバー

名前	型	説明
`map`	`ChizuMap`	The map to show: `WORLD`, a country's own, or a country's regions.
`language` (省略可)	`ChizuLanguage \| undefined`	The language of the names and of the buttons. Default: the page's `lang`, or English.
`zoom` (省略可)	`1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| undefined`	The zoom step to start at (1 to 10). Default 1.
`tones` (省略可)	`Readonly<Record<string, string>> \| undefined`	Tones by code (`drawChizu`'s `tones`). The chosen region is `selected` unless it is given a tone here.
`colors` (省略可)	`Readonly<Record<string, string>> \| undefined`	A colour for each region by code (`drawChizu`'s `colors`): two places told apart, or a map coloured your own way.
`callouts` (省略可)	`readonly string[] \| Omit<CalloutRequest, "box"> \| undefined`	Numbered callouts (`drawChizu`'s `callouts`), placed for the window as it is after each move.
`labels` (省略可)	`boolean \| readonly string[] \| undefined`	Print names on the land.
`selected` (省略可)	`string \| null \| undefined`	The chosen region's code, or null.
`fit` (省略可)	`boolean \| undefined`	Zoom in on a region when it is chosen. Default true.
`selectable` (省略可)	`boolean \| undefined`	Whether pressing a region chooses it. Off, a press does nothing and the map is only looked at (a quiz that asks the question itself). Default true.
`controls` (省略可)	`boolean \| undefined`	Show the zoom buttons and the zoom level. Default true.
`onSelect` (省略可)	`((code: string \| null) => void) \| undefined`	A region was pressed (or its number): its code. Pressing the chosen one again passes null.
`detail` (省略可)	`ChizuMap \| (() => Promise<ChizuMap>) \| undefined`	A finer drawing of the same map, drawn from `detailFrom` in, where the map's own outlines would look angular: the world's is `loadWorldDetail` (pass the function, and it is fetched the first time it is wanted). It is used only when its `id` is the map's with `-detail` after it, so a detail left over from another map is never drawn. Framing, choosing and callouts keep to `map`. Default: none.
`detailFrom` (省略可)	`1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| undefined`	The zoom step the finer drawing starts at. Default 4.
`onView` (省略可)	`((view: ChizuView) => void) \| undefined`	The view changed: after a zoom, and when a drag ends.
`features` (省略可)	`readonly ChizuFeatureChoice[] \| undefined`	Which named features to draw (`drawChizu`'s `features`): `["water"]`, `["all"]`, a group or a kind. Default none.
`featureLayer` (省略可)	`ChizuFeatureLayer \| ((mapId: string) => Promise<ChizuFeatureLayer \| null>) \| null \| undefined`	The map's named features: a layer (`loadFeatures(map.id)`), or `loadFeatures` itself, which is called with each map's id the first time its features are wanted, so a page that changes maps fetches each map's once. A feature can then be pressed, chosen (`select`, `selected`) and shown (`show`) by its code, as a region is.
`featureLabels` (省略可)	`boolean \| undefined`	Print the features' names. Default true.

例

import WORLD from "@johnmorrisdotca/chizu/world";
import { mountChizu, type ChizuMountOptions } from "@johnmorrisdotca/chizu/mount";

const options: ChizuMountOptions = { map: WORLD, language: "ja", selected: "JP", onSelect: (code) => console.log(code) };
mountChizu(document.querySelector<HTMLElement>("#map")!, options);

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

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

ChizuMountOptions型

定義

メンバー

例

`ChizuMountOptions`型