// A function to summarize a single column SummarizeColumn = (data, col) => { let content, value, format, el, chart, missing_label, min, max, median, mean, sd; // Construct content based on type const type = getType(data, col) const col1 = htl.html`${icon_fns[type]()}${col === "" ? "unlabeled" : col}` switch(type) { // Categorical columns case 'ordinal': format = d3.format(",.0f") // Calculate category percent and count const categories = d3.rollups( data, v => ({count:v.length, pct:v.length / data.length || 1}), d => d[col] ).sort((a, b) => b[1].count - a[1].count) .map(d => { let obj = {} obj[col] = (d[0] === null || d[0] === "") ? "(missing)" : d[0] obj.count = d[1].count obj.pct = d[1].pct return obj }) // Create the chart const stack_chart = SmallStack(categories, col) // element to return el = htl.html` ${col1}

${stack_chart}

- - - `; value = {column: col, type, min:null, max: null, mean: null, median: null, sd: null, n_categories:categories.length} break; // Date columns case "date": // Calculate and format start / end const start = d3.min(data, d => +d[col]) const end = d3.max(data, d => +d[col]) mean = d3.mean(data, d => +d[col]); median = d3.median(data, d => +d[col]); sd = d3.deviation(data, d => +d[col]); // Calculate pct. missing chart = Histogram(data, col, type) // Element to return el = htl.html` ${col1}

${chart}

- - - ` value = {column: col, type, min:start, max: end, mean: null, median: null, sd: null, n_categories:null} break; // Continuous columns default: // Compute values format = d3.format(",.4r") min = d3.min(data, d => +d[col]) max = d3.max(data, d => +d[col]) mean = d3.mean(data, d => +d[col]) median = d3.median(data, d => +d[col]) sd = d3.deviation(data, d => +d[col]) chart = Histogram(data, col, type) // Element to return el = htl.html` ${col1}

${chart}

${format(mean)} ${format(median)} ${format(sd)} ` value = {column: col, type, min, max, mean, median, sd, n_categories:null} break; } el.value = value; el.appendChild(html``) return el }