Source code of plot #062 back to plot

Download full working sketch as 062.tar.gz.
Unzip, then start a local web server and load the page in a browser.

import * as E from "../env.js";
import { SvgFont } from "./svg-font.js";

// Declarations below instruct build plugin to copy static files to runtime dir
// STATIC lib/fonts_EMS_EMSReadability.svg


const fontName = "fonts_EMS_EMSReadability.svg";
const sz = 32;
const margin = 30;

/**
 * @type {SvgFont}
 */
let font = null;

export async function caption(w, h, title, id, seed) {

  if (!font) {
    const resp = await fetch(fontName);
    const xml = await resp.text();
    font = new SvgFont(xml);
  }
  drawCaption(w, h, title, id, seed);
}

function drawCaption(w, h, title, id, seed) {
  const d = new Date();
  let paramsText = `${id}/${d.getFullYear()}-${("0" + (d.getMonth() + 1)).slice(-2)}-${("0" + d.getDate()).slice(-2)}`;
  if (seed !== undefined)
    paramsText += `/${seed}`;
  const hasTitle = title !== null && title !== undefined && title != "";
  const text = hasTitle ? `${title}  |  ${paramsText}` : paramsText;
  write(w - margin, h - margin, sz, text, "right");
}

function write(x, y, sz, text, align = "left") {
  const txt = font.write(sz, text);
  let cx = x;
  if (align == "right") cx = x - txt.width;
  else if (align == "center") cx = x - txt.width * 0.5;
  txt.g.setAttribute("transform", `translate(${cx}, ${y})`);
  E.addGroup(txt.g);
}