Kyogijo Stadiums競技場

Guides, the reference, a gallery of every picture it can draw, and how it compares: the pages are made from the package's own files when the site is built.

The pages are in English; this contents, the search and the buttons are in Japanese.

Gallery: the real stadiums and a district

BC Place in Vancouver, Seattle's two stadiums and, in Japan, Tokyo Dome, Korakuen Hall and Koshien Stadium, each in the outline of its building as OpenStreetMap maps it ((c) OpenStreetMap contributors, ODbL 1.0), with a plausible bowl of the seats the sources give for each; then districts, venues of one city on one plan at their real positions and orientations. A small arrow says where north is. Never a seat map, never a street map, and no mark of a club, a league or a tournament.

BC Place5
Lumen Field and T-Mobile Park4
Tokyo Dome, Korakuen Hall and Koshien Stadium4
A district8

21 pictures, each drawn by the build from the code under it, which the Copy button copies. They are drawn as they come near the screen. Open in a page loads the published package from jsDelivr, which serves only released versions.

BC Place#

crowd: { real: true } with a stadium, for sport: "cfl" or sport: "soccer".

The football field

54,500 seats in 2 bowls (documented), a retractable, cable-supported roof (documented); the field lies along the opening in the roof.

tsDownload SVG Open in a page

import { drawKyogijo } from "@johnmorrisdotca/kyogijo-stadiums";

const svg = drawKyogijo({ sport: "cfl", stadium: "bc-place", crowd: { real: true } });

The soccer pitch

52,497 seats in 2 bowls (documented), a retractable, cable-supported roof (documented); the field lies along the opening in the roof.

tsDownload SVG Open in a page

import { drawKyogijo } from "@johnmorrisdotca/kyogijo-stadiums";

const svg = drawKyogijo({ sport: "soccer", stadium: "bc-place", crowd: { real: true } });

The football field, dark

54,500 seats in 2 bowls (documented), a retractable, cable-supported roof (documented); the field lies along the opening in the roof.

tsDownload SVG Open in a page

import { drawKyogijo } from "@johnmorrisdotca/kyogijo-stadiums";

const svg = drawKyogijo({ sport: "cfl", stadium: "bc-place", crowd: { real: true }, theme: "dark" });

The soccer pitch, in Japanese

52,497 seats in 2 bowls (documented), a retractable, cable-supported roof (documented); the field lies along the opening in the roof.

tsDownload SVG Open in a page

import { drawKyogijo } from "@johnmorrisdotca/kyogijo-stadiums";

const svg = drawKyogijo({ sport: "soccer", stadium: "bc-place", crowd: { real: true }, language: "ja" });

The football field, small

Under 480 pixels wide the crowd is plain blocks and the outline and the arrow stay.

tsDownload SVG Open in a page

import { drawKyogijo } from "@johnmorrisdotca/kyogijo-stadiums";

const svg = drawKyogijo({ sport: "cfl", stadium: "bc-place", crowd: { real: true }, width: 320 });

Lumen Field and T-Mobile Park#

Lumen Field's football field and soccer pitch under its canopies, and T-Mobile Park, a ballpark, with its roof: the field lies as OpenStreetMap maps the pitches and the infield.

Lumen Field, the football field

68,740 seats in 3 bowls (documented), a canopy over 70 percent of the seats (documented); the field lies north and south as the pitches are mapped.

tsDownload SVG Open in a page

import { drawKyogijo } from "@johnmorrisdotca/kyogijo-stadiums";

const svg = drawKyogijo({ sport: "nfl", stadium: "lumen-field", crowd: { real: true } });

Lumen Field, the soccer pitch

The same bowl with the soccer configuration's 37,722 seats open from the lowest bowl up: the upper bowl and part of the middle one are closed, drawn empty.

tsDownload SVG Open in a page

import { drawKyogijo } from "@johnmorrisdotca/kyogijo-stadiums";

const svg = drawKyogijo({ sport: "soccer", stadium: "lumen-field", crowd: { real: true } });

T-Mobile Park

47,368 seats in a lower bowl, an upper bowl and the bleachers, each as deep as its levels' seats need; home plate faces north-east, from the infield OpenStreetMap maps and the building's outline.

tsDownload SVG Open in a page

import { drawKyogijo } from "@johnmorrisdotca/kyogijo-stadiums";

const svg = drawKyogijo({ sport: "mlb", park: "t-mobile-park", crowd: { real: true } });

T-Mobile Park, dark, in Japanese

The park's name, the seats and the way home plate faces are said in Japanese.

tsDownload SVG Open in a page

import { drawKyogijo } from "@johnmorrisdotca/kyogijo-stadiums";

const svg = drawKyogijo({ sport: "mlb", park: "t-mobile-park", crowd: { real: true }, theme: "dark", language: "ja" });

Tokyo Dome, Korakuen Hall and Koshien Stadium#

A ballpark under an air-supported roof, a hall with a boxing ring and an open-air ballpark with its ivy walls and all-dirt infield: where no source says how a field lies, the drawing says so and draws no arrow to north.

Tokyo Dome

45,600 seats; the way home plate faces is not known (no diamond is mapped in the dome), so the field lies the way that fits the building and no arrow points north.

tsDownload SVG Open in a page

import { drawKyogijo } from "@johnmorrisdotca/kyogijo-stadiums";

const svg = drawKyogijo({ sport: "mlb", park: "tokyo-dome", crowd: { real: true } });

Korakuen Hall

1,403 seats on the floor, round the ring, and the balconies' standing places up to 2,005 closed and empty; the ring lies along the building's long axis, an inference.

tsDownload SVG Open in a page

import { drawKyogijo } from "@johnmorrisdotca/kyogijo-stadiums";

const svg = drawKyogijo({ sport: "boxing", stadium: "korakuen-hall", crowd: { real: true } });

Koshien Stadium

47,400 seats in the open air; the walls are green for the ivy and the infield is all dirt; home plate faces 172 degrees, from the mapped grass of the field fitted to the fence.

tsDownload SVG Open in a page

import { drawKyogijo } from "@johnmorrisdotca/kyogijo-stadiums";

const svg = drawKyogijo({ sport: "mlb", park: "hanshin-koshien-stadium", crowd: { real: true } });

Koshien Stadium, dark, in Japanese

The park's name, the seats and the way home plate faces are said in Japanese.

tsDownload SVG Open in a page

import { drawKyogijo } from "@johnmorrisdotca/kyogijo-stadiums";

const svg = drawKyogijo({
  sport: "mlb",
  park: "hanshin-koshien-stadium",
  crowd: { real: true },
  theme: "dark",
  language: "ja",
});

A district#

drawDistrict with a list of venue keys: each venue as its own page draws it, put where it stands and turned as it lies, with a grid, a scale and a north arrow.

BC Place and Rogers Arena, neighbours

The middles of the two are 264 metres apart; a line of the grid every 100 metres.

tsDownload SVG Open in a page

import { drawDistrict } from "@johnmorrisdotca/kyogijo-stadiums/district";

const svg = drawDistrict({ venues: ["bc-place", "rogers-arena"] });

The same with BC Place for soccer, with names

A stadium names the configuration it is drawn in: `bc-place:soccer`.

tsDownload SVG Open in a page

import { drawDistrict } from "@johnmorrisdotca/kyogijo-stadiums/district";

const svg = drawDistrict({ venues: ["bc-place:soccer", "rogers-arena"], labels: true });

Turned to lie across the page

`turn: "auto"` turns the map, north arrow and all, so that the district's long way lies across the page.

tsDownload SVG Open in a page

import { drawDistrict } from "@johnmorrisdotca/kyogijo-stadiums/district";

const svg = drawDistrict({ venues: ["bc-place", "rogers-arena"], turn: "auto" });

As a city

`mode: "city"` keeps the real distances with a grid of kilometres and a name beside each venue.

tsDownload SVG Open in a page

import { drawDistrict } from "@johnmorrisdotca/kyogijo-stadiums/district";

const svg = drawDistrict({ venues: ["bc-place", "rogers-arena"], mode: "city" });

Seattle's SoDo: T-Mobile Park and Lumen Field

459 metres apart, Lumen Field to the north; the ballpark's drawing is turned 49.4 degrees, centre field to the north-east.

tsDownload SVG Open in a page

import { drawDistrict } from "@johnmorrisdotca/kyogijo-stadiums/district";

const svg = drawDistrict({ venues: ["t-mobile-park", "lumen-field"], labels: true });

Seattle as a city

The two stadiums and Climate Pledge Arena, 3.4 to 3.8 kilometres from them, at their real distances with a grid of kilometres.

tsDownload SVG Open in a page

import { drawDistrict } from "@johnmorrisdotca/kyogijo-stadiums/district";

const svg = drawDistrict({ venues: ["t-mobile-park", "lumen-field", "climate-pledge-arena"], mode: "city", turn: "auto" });

Tokyo Dome City: Tokyo Dome and Korakuen Hall

The hall stands about 140 metres south of the Dome's middle; nothing says how the Dome's field lies, so its drawing lies the way that fits its building.

tsDownload SVG Open in a page

import { drawDistrict } from "@johnmorrisdotca/kyogijo-stadiums/district";

const svg = drawDistrict({ venues: ["tokyo-dome", "korakuen-hall"], labels: true });

In Japanese, dark

The names and the description are in Japanese.

tsDownload SVG Open in a page

import { drawDistrict } from "@johnmorrisdotca/kyogijo-stadiums/district";

const svg = drawDistrict({ venues: ["bc-place", "rogers-arena"], language: "ja", theme: "dark", labels: true });