tsb — Web Analytics

1 · Pivot pageviews by source × device

Sum pageviews into a 2-D table.

TypeScript

Click ▶ Run to execute

Ctrl+Enter to run · Tab to indent

2 · Add row totals + bar chart of sources

Marketing wants the bottom line: total pageviews per source.

TypeScript

import { DataFrame } from "tsb";

const piv = DataFrame.fromColumns({
  source:   ["direct", "facebook", "google"],
  desktop:  [150, 350, 600],
  mobile:   [305, 470, 1210],
  tablet:   [30, 60, 155],
});

const total = piv.col("desktop").add(piv.col("mobile")).add(piv.col("tablet"));
const out = piv.assign({ total });
console.log(out.toString());

function bar(label: string, value: number, max: number, width = 28): string {
  const len = max > 0 ? Math.round((value / max) * width) : 0;
  return label.padEnd(14) + " | " + "\u2588".repeat(len) + " " + value.toFixed(2);
}
function chart(title: string, rows: Array<[string, number]>): void {
  const maxV = Math.max(...rows.map(r => r[1]));
  console.log(title);
  for (const [label, value] of rows) console.log(bar(label, value, maxV));
}

const sources = [...out.col("source").values].map(String);
const totals  = [...out.col("total").values].map(Number);
const rows: Array<[string, number]> = sources.map((s, i) => [s, totals[i] as number]);
rows.sort((a, b) => b[1] - a[1]);
console.log("");
chart("Total pageviews by source", rows);

Click ▶ Run to execute

Ctrl+Enter to run · Tab to indent

🌐 Web Analytics Pivot Table

1 · Pivot pageviews by source × device

2 · Add row totals + bar chart of sources