Smallest map renderer

by fxi

JavaScript

function mm(w, h, lg, lt, z) {
  let d = document,
    e = t => d.createElement(t),
    s = 256,
    g = 360,
    m = Math,
    x = s * (1 << z) * (lg / g + 0.5) - w / 2 | 0,
    y = s * (1 << z) * (1 - m.log(m.tan(m.PI * (0.25 + lt / 360))) / m.PI) / 2 - h / 2 | 0,
    c = e `canvas`,
    k = c.getContext `2d`;
  c.width = w;
  c.height = h;
  d.body.appendChild(c);

  for (let ty = y / s | 0; ty * s < y + h; ty++)
    for (let tx = x / s | 0; tx * s < x + w; tx++) {
      let i = e `img`;
      i.src = `https://tile.osm.org/${z}/${tx}/${ty}.png`;
      i.onload = n => {
        k.drawImage(i, tx * s - x, ty * s - y);
      }
    }
}

mm(500, 500, 6.112, 46.213, 17)