本文へ移動

Chizu地図

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

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

目次

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

localMap関数

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

A local map: the ground of a city or a venue, from caller-given GeoJSON and pictures, in a projection made for a small piece of the earth. Nothing is fetched and no map data is added: what is drawn is what is passed in, with the credit lines the caller passes. A unit of the canvas is metresPerUnit metres (default: the longer side over 1,000), stated in projection, so a distance on the canvas is a distance on the ground. projectPoint and unprojectPoint work on it, and mapBoxFromLocal and localCanvasFromBox hand over to and from a world or country map.

インポート

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

定義

function localMap(options: ChizuLocalOptions): ChizuLocalMap

引数

名前型説明
optionsChizuLocalOptions

The centre, the width in metres, the data and pictures, and the credit lines.

戻り値

ChizuLocalMap

The local map: a canvas in metres with its projection, shapes, pictures and credits.

例

import { groundDistance, localMap, projectPoint } from "@johnmorrisdotca/chizu";

const map = localMap({ centre: [-0.2795, 51.556], widthMetres: 1000, metresPerUnit: 1 });
const a = projectPoint(map, -0.2795, 51.556)!;
const b = projectPoint(map, -0.2795, 51.557)!;
// 0.001° of latitude is 111 m, and the canvas is in metres.
console.log(Math.round(Math.hypot(b[0] - a[0], b[1] - a[1])), Math.round(groundDistance([-0.2795, 51.556], [-0.2795, 51.557])));
// 111 111
111 111

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

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

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