A medal table in a corner

`position: "corner"` is the top right corner; a medal table is narrow enough to leave the middle alone.

Athletics trackDrawn as: an athletics track of 400 metres with 8 lanes, its bends of 36.50 metres radius at the kerb and its straights of 84.39 metres, with the finish line and the lane numbers. A soccer pitch lies inside the track. Field events marked: High jump, Pole vault, Long jump, Triple jump, Shot put, Discus throw, Hammer throw, Javelin throw.

The picture above was drawn when the docs were built. The script below draws it again with the published package.

import { drawKyogijo } from "@johnmorrisdotca/kyogijo-stadiums";
import { broadcastMedalTable, broadcastMedalSize } from "@johnmorrisdotca/taisen-brackets";

const source = {
  title: "Medal table",
  subtitle: "Day 12",
  date: "Games",
  rows: [
    { name: "Japan", code: "JPN", flag: "JP", gold: 14, silver: 6, bronze: 9 },
    { name: "Australia", code: "AUS", flag: "AU", gold: 11, silver: 8, bronze: 7 },
    { name: "United States", code: "USA", flag: "US", gold: 10, silver: 12, bronze: 8 },
    { name: "France", code: "FRA", flag: "FR", gold: 8, silver: 7, bronze: 11 },
    { name: "Great Britain", code: "GBR", flag: "GB", gold: 7, silver: 9, bronze: 6 },
    { name: "China", code: "CHN", flag: "CN", gold: 7, silver: 6, bronze: 5 },
    { name: "Netherlands", code: "NED", flag: "NL", gold: 5, silver: 4, bronze: 7 },
    { name: "Brazil", code: "BRA", flag: "BR", gold: 3, silver: 5, bronze: 6 },
  ],
};
const svg = drawKyogijo({
  sport: "athletics",
  board: { svg: broadcastMedalTable(source, { width: 720, look: "night" }), ...broadcastMedalSize(source.rows.length, { width: 720 }), position: "corner" },
});

This page imports the package from jsDelivr (major version 0), which serves only versions that have been published to npm. A feature added after the last release is not in it: the page then keeps the picture above and says why. The docs were built from version 0.64.0.