Results

The medals, the times, the reaction times and the splits.

Results, 100 mDrawn 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. Races marked: 100 m. A close-up of the finish line. Shows only the finish line. Data outside it is not drawn. Data: 6 Splits. Values from 5.6 to 5.65. 6 Places. 6 Places. 6 Names. 6 Reaction times.6 SplitsValues from 5.6 to 5.65.50 m: 5.63 s50 m: 5.62 s50 m: 5.64 s50 m: 5.60 s50 m: 5.61 s50 m: 5.65 s6 PlacesKerley, Gold, 9.80Jacobs, Silver, 9.83Thompson, Bronze, 9.86Bromell, 9.89Hughes, 9.95Simbine, 9.986 Places1234566 NamesKerley 9.80Jacobs 9.83Thompson 9.86Bromell 9.89Hughes 9.95Simbine 9.986 Reaction times0.160Reaction 0.160 s0.150Reaction 0.150 s0.170Reaction 0.170 s0.130Reaction 0.130 s0.140Reaction 0.140 s0.180Reaction 0.180 s

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

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

const flag = (a, b, c) => `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 3 2"><rect width="1" height="2" fill="${a}"/><rect x="1" width="1" height="2" fill="${b}"/><rect x="2" width="1" height="2" fill="${c}"/></svg>`;
const field = [
  { lane: 1, name: "Bromell", country: "USA", flag: flag("#b22234", "#fff", "#3c3b6e") },
  { lane: 2, name: "Hughes", country: "GBR", flag: flag("#012169", "#fff", "#c8102e") },
  { lane: 3, name: "Jacobs", country: "ITA", flag: flag("#009246", "#fff", "#ce2b37") },
  { lane: 4, name: "Kerley", country: "USA", flag: flag("#b22234", "#fff", "#3c3b6e") },
  { lane: 5, name: "Thompson", country: "JAM", flag: flag("#009b3a", "#000", "#fed100") },
  { lane: 6, name: "Simbine", country: "RSA", flag: flag("#007749", "#e03c31", "#001489") },
];
const results = field.map((entry, i) => ({ ...entry, place: [4, 5, 2, 1, 3, 6][i], time: 9.8 + [3, 5, 1, 0, 2, 6][i] * 0.03, reaction: 0.13 + i * 0.01, splits: [{ distance: 50, time: 5.6 + i * 0.01 }] }));
const svg = raceResults(results, { race: "100m" }).draw();

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.6.1.