Skip to content

Repository files navigation

numdenom

Converter from CSV files that have particularly named columns into interactive HTML tables.

formula

Example

$ cat sample.csv
a,b,x_num,x_denom,y_num,y_denom
qqq,t0,3,4,2,5
qqq,t1,3,5,1,2
qqq,t2,1,3,0,6
qqq,t3,4,4,2,4
qqq,t4,0,3,2,9
www,t0,0,0,3,3
www,t1,0,0,3,4
www,t2,0,1,4,4
www,t3,0,0,2,3
www,t5,1,1,4,5
$ ./numdenom.py sample.csv sample.html

screenshot

Algorithm

  1. Read a CSV file and divide all its columns in two types: filter columns and value columns.
  2. Value columns are pairs of columns named x_num and x_denom. They should only contain numbers. Filter columns are all columns not named like *_num or *_denom. Alternatively, there can be just x_num and a common, shared denom column. In the latter case the denom column becomes N column in the output table.
  3. Output a HTML file that contains input file in a compressed form, along with some JavaScript code. The file is self-contained and can be opened using file:// links.
  4. Within the generated page, render all filter columns as combo-boxes on the left side. Each change of the filter settings recalculate the table.
  5. For each value column, calculate the cell value by summing all _num values, then dividing it by the sum of _denom values. Rows not matching the filter settings are excluded from the sums. Special filter setting value _COL promotes filter column to show all its values separately as individual rows.

Value columns are sorted lexicographically. Content of filter columns is also sorted lexicographically. Order of the columns or rows within the CSV file does not matter.

Additional features

  • Cell values are subtly colorised to indicate where the value stands from column minimum to column maximum. Checking the checkbox near value column's name makes colorisation bright instead of subtle.
  • When filtering some rows out, percentage above value column headers indicates share of remaining denominators.
  • When _COL mode is used, averages are displayed at the top.
  • Tool-tip shows specific aggregated numerators and denominators for each cell.
  • Dark theme is supported (should trigger automatically when needed).
  • You can set minimal denominator value to hide cells where aggregated denominator is too low.
  • You can use URL fragment specifier like #b=_COL to provide initial filter settings (and other settings). URL fragment is updated automatically when you change settings.
  • There is a feature to quickly display a chart of some column.
  • Source CSV data can be extracted from the page.
  • You can include additional information into the table as a collapsible section.
  • Special _CHK mode to select multiple filter values using checkboxes.
  • Special _DIST mode to see distribution of N (i.e. denom) as columns.

Limitations

  • Data is assumed to be not big enough. All rows are iterated every time you click on some setting on the page, so the more data you have, the bigger and slower would the resulting html be. Megabyte-sized files do work reasonably well though.
  • Data are assumed to be reasonable, e.g. filter values should not be literally _COL or *. Quotation marks or commas can lead to problems with CSV round-trip.
  • Missing value numbers are turned into 0s.
  • Additional command line arguments (table title and description file) are assumed to be trusted. You can include raw HTML there.
  • In _DIST mode it would be a mess if you select multiple _DIST filters and their values do intersect.

Building and running.

You can download a pre-built numdenom.py from Github releases. The script is self-contained and is expected to depend only on Python's standard library.

Building numdenom.py requires Make and Typescript to be available and is performed by running make in the source code directory.

About

One-file interactive html table builder for data of some numerators with filters divided by denominators with the same filters

Topics

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Add copy buttons to all
 blocks
(function() {
function addCopyButtons() {
document.querySelectorAll('pre code').forEach(function(codeBlock) {
if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;
codeBlock.parentElement.setAttribute('data-copy-added', 'true');
var btn = document.createElement('button');
btn.textContent = 'Copy';
btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';
btn.onmouseover = function() { this.style.opacity = '1'; };
btn.onmouseout = function() { this.style.opacity = '0.7'; };
btn.onclick = function() {
navigator.clipboard.writeText(codeBlock.textContent).then(function() {
btn.textContent = 'Copied!';
setTimeout(function() { btn.textContent = 'Copy'; }, 1500);
});
};
codeBlock.parentElement.style.position = 'relative';
codeBlock.parentElement.appendChild(btn);
});
}
addCopyButtons();
// Re-run on dynamic content
var observer = new MutationObserver(addCopyButtons);
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
GitHub - vi/numdenom: One-file interactive html table builder for data of some numerators with filters divided by denominators with the same filters · GitHub
Skip to content

Repository files navigation

numdenom

Converter from CSV files that have particularly named columns into interactive HTML tables.

formula

Example

$ cat sample.csv
a,b,x_num,x_denom,y_num,y_denom
qqq,t0,3,4,2,5
qqq,t1,3,5,1,2
qqq,t2,1,3,0,6
qqq,t3,4,4,2,4
qqq,t4,0,3,2,9
www,t0,0,0,3,3
www,t1,0,0,3,4
www,t2,0,1,4,4
www,t3,0,0,2,3
www,t5,1,1,4,5
$ ./numdenom.py sample.csv sample.html

screenshot

Algorithm

  1. Read a CSV file and divide all its columns in two types: filter columns and value columns.
  2. Value columns are pairs of columns named x_num and x_denom. They should only contain numbers. Filter columns are all columns not named like *_num or *_denom. Alternatively, there can be just x_num and a common, shared denom column. In the latter case the denom column becomes N column in the output table.
  3. Output a HTML file that contains input file in a compressed form, along with some JavaScript code. The file is self-contained and can be opened using file:// links.
  4. Within the generated page, render all filter columns as combo-boxes on the left side. Each change of the filter settings recalculate the table.
  5. For each value column, calculate the cell value by summing all _num values, then dividing it by the sum of _denom values. Rows not matching the filter settings are excluded from the sums. Special filter setting value _COL promotes filter column to show all its values separately as individual rows.

Value columns are sorted lexicographically. Content of filter columns is also sorted lexicographically. Order of the columns or rows within the CSV file does not matter.

Additional features

  • Cell values are subtly colorised to indicate where the value stands from column minimum to column maximum. Checking the checkbox near value column's name makes colorisation bright instead of subtle.
  • When filtering some rows out, percentage above value column headers indicates share of remaining denominators.
  • When _COL mode is used, averages are displayed at the top.
  • Tool-tip shows specific aggregated numerators and denominators for each cell.
  • Dark theme is supported (should trigger automatically when needed).
  • You can set minimal denominator value to hide cells where aggregated denominator is too low.
  • You can use URL fragment specifier like #b=_COL to provide initial filter settings (and other settings). URL fragment is updated automatically when you change settings.
  • There is a feature to quickly display a chart of some column.
  • Source CSV data can be extracted from the page.
  • You can include additional information into the table as a collapsible section.
  • Special _CHK mode to select multiple filter values using checkboxes.
  • Special _DIST mode to see distribution of N (i.e. denom) as columns.

Limitations

  • Data is assumed to be not big enough. All rows are iterated every time you click on some setting on the page, so the more data you have, the bigger and slower would the resulting html be. Megabyte-sized files do work reasonably well though.
  • Data are assumed to be reasonable, e.g. filter values should not be literally _COL or *. Quotation marks or commas can lead to problems with CSV round-trip.
  • Missing value numbers are turned into 0s.
  • Additional command line arguments (table title and description file) are assumed to be trusted. You can include raw HTML there.
  • In _DIST mode it would be a mess if you select multiple _DIST filters and their values do intersect.

Building and running.

You can download a pre-built numdenom.py from Github releases. The script is self-contained and is expected to depend only on Python's standard library.

Building numdenom.py requires Make and Typescript to be available and is performed by running make in the source code directory.

About

One-file interactive html table builder for data of some numerators with filters divided by denominators with the same filters

Topics

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Force GitHub README to respect dark mode (function() { var style = document.createElement('style'); style.textContent = ' .markdown-body { color-scheme: dark light; } .markdown-body pre { background: #161b22 !important; } .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; } .markdown-body table th, .markdown-body table td { border-color: #30363d !important; } .markdown-body img { background: #0d1117; } .markdown-body blockquote { border-left-color: #8b949e; } .markdown-body hr { border-color: #30363d; } '; document.head.appendChild(style); })(); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' GitHub - vi/numdenom: One-file interactive html table builder for data of some numerators with filters divided by denominators with the same filters · GitHub
Skip to content

Repository files navigation

numdenom

Converter from CSV files that have particularly named columns into interactive HTML tables.

formula

Example

$ cat sample.csv
a,b,x_num,x_denom,y_num,y_denom
qqq,t0,3,4,2,5
qqq,t1,3,5,1,2
qqq,t2,1,3,0,6
qqq,t3,4,4,2,4
qqq,t4,0,3,2,9
www,t0,0,0,3,3
www,t1,0,0,3,4
www,t2,0,1,4,4
www,t3,0,0,2,3
www,t5,1,1,4,5
$ ./numdenom.py sample.csv sample.html

screenshot

Algorithm

  1. Read a CSV file and divide all its columns in two types: filter columns and value columns.
  2. Value columns are pairs of columns named x_num and x_denom. They should only contain numbers. Filter columns are all columns not named like *_num or *_denom. Alternatively, there can be just x_num and a common, shared denom column. In the latter case the denom column becomes N column in the output table.
  3. Output a HTML file that contains input file in a compressed form, along with some JavaScript code. The file is self-contained and can be opened using file:// links.
  4. Within the generated page, render all filter columns as combo-boxes on the left side. Each change of the filter settings recalculate the table.
  5. For each value column, calculate the cell value by summing all _num values, then dividing it by the sum of _denom values. Rows not matching the filter settings are excluded from the sums. Special filter setting value _COL promotes filter column to show all its values separately as individual rows.

Value columns are sorted lexicographically. Content of filter columns is also sorted lexicographically. Order of the columns or rows within the CSV file does not matter.

Additional features

  • Cell values are subtly colorised to indicate where the value stands from column minimum to column maximum. Checking the checkbox near value column's name makes colorisation bright instead of subtle.
  • When filtering some rows out, percentage above value column headers indicates share of remaining denominators.
  • When _COL mode is used, averages are displayed at the top.
  • Tool-tip shows specific aggregated numerators and denominators for each cell.
  • Dark theme is supported (should trigger automatically when needed).
  • You can set minimal denominator value to hide cells where aggregated denominator is too low.
  • You can use URL fragment specifier like #b=_COL to provide initial filter settings (and other settings). URL fragment is updated automatically when you change settings.
  • There is a feature to quickly display a chart of some column.
  • Source CSV data can be extracted from the page.
  • You can include additional information into the table as a collapsible section.
  • Special _CHK mode to select multiple filter values using checkboxes.
  • Special _DIST mode to see distribution of N (i.e. denom) as columns.

Limitations

  • Data is assumed to be not big enough. All rows are iterated every time you click on some setting on the page, so the more data you have, the bigger and slower would the resulting html be. Megabyte-sized files do work reasonably well though.
  • Data are assumed to be reasonable, e.g. filter values should not be literally _COL or *. Quotation marks or commas can lead to problems with CSV round-trip.
  • Missing value numbers are turned into 0s.
  • Additional command line arguments (table title and description file) are assumed to be trusted. You can include raw HTML there.
  • In _DIST mode it would be a mess if you select multiple _DIST filters and their values do intersect.

Building and running.

You can download a pre-built numdenom.py from Github releases. The script is self-contained and is expected to depend only on Python's standard library.

Building numdenom.py requires Make and Typescript to be available and is performed by running make in the source code directory.

About

One-file interactive html table builder for data of some numerators with filters divided by denominators with the same filters

Topics

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Highlight search terms from Google/DuckDuckGo/Bing referrer (function() { var ref = document.referrer; var terms = []; if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) { var url = new URL(ref); var q = url.searchParams.get('q') || url.searchParams.get('p'); if (q) { terms = q.split(/\s+/).filter(function(t) { return t.length > 2; }); } } if (terms.length === 0) return; var style = document.createElement('style'); style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }'; document.head.appendChild(style); function highlight(node) { if (node.nodeType === 3) { // text node var text = node.textContent; var found = false; terms.forEach(function(term) { var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\]\\]/g, '\\') + ')', 'gi'); if (regex.test(text)) { found = true; var frag = document.createDocumentFragment(); var parts = text.split(regex); parts.forEach(function(part, i) { if (i % 2 === 0) { frag.appendChild(document.createTextNode(part)); } else { var span = document.createElement('span'); span.className = 'userscript-highlight'; span.textContent = part; frag.appendChild(span); } }); node.parentNode.replaceChild(frag, node); } }); } else if (node.nodeType === 1 && node.childNodes) { // element var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT']; if (!skipTags.includes(node.tagName)) { Array.from(node.childNodes).forEach(highlight); } } } highlight(document.body); // Re-highlight on dynamic content var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1 || node.nodeType === 3) highlight(node); }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' GitHub - vi/numdenom: One-file interactive html table builder for data of some numerators with filters divided by denominators with the same filters · GitHub
Skip to content

Repository files navigation

numdenom

Converter from CSV files that have particularly named columns into interactive HTML tables.

formula

Example

$ cat sample.csv
a,b,x_num,x_denom,y_num,y_denom
qqq,t0,3,4,2,5
qqq,t1,3,5,1,2
qqq,t2,1,3,0,6
qqq,t3,4,4,2,4
qqq,t4,0,3,2,9
www,t0,0,0,3,3
www,t1,0,0,3,4
www,t2,0,1,4,4
www,t3,0,0,2,3
www,t5,1,1,4,5
$ ./numdenom.py sample.csv sample.html

screenshot

Algorithm

  1. Read a CSV file and divide all its columns in two types: filter columns and value columns.
  2. Value columns are pairs of columns named x_num and x_denom. They should only contain numbers. Filter columns are all columns not named like *_num or *_denom. Alternatively, there can be just x_num and a common, shared denom column. In the latter case the denom column becomes N column in the output table.
  3. Output a HTML file that contains input file in a compressed form, along with some JavaScript code. The file is self-contained and can be opened using file:// links.
  4. Within the generated page, render all filter columns as combo-boxes on the left side. Each change of the filter settings recalculate the table.
  5. For each value column, calculate the cell value by summing all _num values, then dividing it by the sum of _denom values. Rows not matching the filter settings are excluded from the sums. Special filter setting value _COL promotes filter column to show all its values separately as individual rows.

Value columns are sorted lexicographically. Content of filter columns is also sorted lexicographically. Order of the columns or rows within the CSV file does not matter.

Additional features

  • Cell values are subtly colorised to indicate where the value stands from column minimum to column maximum. Checking the checkbox near value column's name makes colorisation bright instead of subtle.
  • When filtering some rows out, percentage above value column headers indicates share of remaining denominators.
  • When _COL mode is used, averages are displayed at the top.
  • Tool-tip shows specific aggregated numerators and denominators for each cell.
  • Dark theme is supported (should trigger automatically when needed).
  • You can set minimal denominator value to hide cells where aggregated denominator is too low.
  • You can use URL fragment specifier like #b=_COL to provide initial filter settings (and other settings). URL fragment is updated automatically when you change settings.
  • There is a feature to quickly display a chart of some column.
  • Source CSV data can be extracted from the page.
  • You can include additional information into the table as a collapsible section.
  • Special _CHK mode to select multiple filter values using checkboxes.
  • Special _DIST mode to see distribution of N (i.e. denom) as columns.

Limitations

  • Data is assumed to be not big enough. All rows are iterated every time you click on some setting on the page, so the more data you have, the bigger and slower would the resulting html be. Megabyte-sized files do work reasonably well though.
  • Data are assumed to be reasonable, e.g. filter values should not be literally _COL or *. Quotation marks or commas can lead to problems with CSV round-trip.
  • Missing value numbers are turned into 0s.
  • Additional command line arguments (table title and description file) are assumed to be trusted. You can include raw HTML there.
  • In _DIST mode it would be a mess if you select multiple _DIST filters and their values do intersect.

Building and running.

You can download a pre-built numdenom.py from Github releases. The script is self-contained and is expected to depend only on Python's standard library.

Building numdenom.py requires Make and Typescript to be available and is performed by running make in the source code directory.

About

One-file interactive html table builder for data of some numerators with filters divided by denominators with the same filters

Topics

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Strip utm_, fbclid, gclid, etc. from all links on page (function() { var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content', 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid', 'ref', 'ref_src', 'source', 'medium', 'campaign']; function cleanUrl(url) { try { var u = new URL(url, window.location.origin); var changed = false; trackingParams.forEach(function(p) { if (u.searchParams.has(p)) { u.searchParams.delete(p); changed = true; } }); return changed ? u.toString() : url; } catch (e) { return url; } } function cleanLinks() { document.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } cleanLinks(); var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1) { if (node.tagName === 'A') cleanLinks(); node.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + ' GitHub - vi/numdenom: One-file interactive html table builder for data of some numerators with filters divided by denominators with the same filters · GitHub
Skip to content

Repository files navigation

numdenom

Converter from CSV files that have particularly named columns into interactive HTML tables.

formula

Example

$ cat sample.csv
a,b,x_num,x_denom,y_num,y_denom
qqq,t0,3,4,2,5
qqq,t1,3,5,1,2
qqq,t2,1,3,0,6
qqq,t3,4,4,2,4
qqq,t4,0,3,2,9
www,t0,0,0,3,3
www,t1,0,0,3,4
www,t2,0,1,4,4
www,t3,0,0,2,3
www,t5,1,1,4,5
$ ./numdenom.py sample.csv sample.html

screenshot

Algorithm

  1. Read a CSV file and divide all its columns in two types: filter columns and value columns.
  2. Value columns are pairs of columns named x_num and x_denom. They should only contain numbers. Filter columns are all columns not named like *_num or *_denom. Alternatively, there can be just x_num and a common, shared denom column. In the latter case the denom column becomes N column in the output table.
  3. Output a HTML file that contains input file in a compressed form, along with some JavaScript code. The file is self-contained and can be opened using file:// links.
  4. Within the generated page, render all filter columns as combo-boxes on the left side. Each change of the filter settings recalculate the table.
  5. For each value column, calculate the cell value by summing all _num values, then dividing it by the sum of _denom values. Rows not matching the filter settings are excluded from the sums. Special filter setting value _COL promotes filter column to show all its values separately as individual rows.

Value columns are sorted lexicographically. Content of filter columns is also sorted lexicographically. Order of the columns or rows within the CSV file does not matter.

Additional features

  • Cell values are subtly colorised to indicate where the value stands from column minimum to column maximum. Checking the checkbox near value column's name makes colorisation bright instead of subtle.
  • When filtering some rows out, percentage above value column headers indicates share of remaining denominators.
  • When _COL mode is used, averages are displayed at the top.
  • Tool-tip shows specific aggregated numerators and denominators for each cell.
  • Dark theme is supported (should trigger automatically when needed).
  • You can set minimal denominator value to hide cells where aggregated denominator is too low.
  • You can use URL fragment specifier like #b=_COL to provide initial filter settings (and other settings). URL fragment is updated automatically when you change settings.
  • There is a feature to quickly display a chart of some column.
  • Source CSV data can be extracted from the page.
  • You can include additional information into the table as a collapsible section.
  • Special _CHK mode to select multiple filter values using checkboxes.
  • Special _DIST mode to see distribution of N (i.e. denom) as columns.

Limitations

  • Data is assumed to be not big enough. All rows are iterated every time you click on some setting on the page, so the more data you have, the bigger and slower would the resulting html be. Megabyte-sized files do work reasonably well though.
  • Data are assumed to be reasonable, e.g. filter values should not be literally _COL or *. Quotation marks or commas can lead to problems with CSV round-trip.
  • Missing value numbers are turned into 0s.
  • Additional command line arguments (table title and description file) are assumed to be trusted. You can include raw HTML there.
  • In _DIST mode it would be a mess if you select multiple _DIST filters and their values do intersect.

Building and running.

You can download a pre-built numdenom.py from Github releases. The script is self-contained and is expected to depend only on Python's standard library.

Building numdenom.py requires Make and Typescript to be available and is performed by running make in the source code directory.

About

One-file interactive html table builder for data of some numerators with filters divided by denominators with the same filters

Topics

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Auto-enable theater mode on YouTube (function() { function tryTheater() { var btn = document.querySelector('button[aria-label="Theater mode"], ytd-player #player button[title="Theater mode"]'); if (btn && !btn.classList.contains('activated')) { btn.click(); } } // Try immediately tryTheater(); // Try after navigation (SPA) var lastUrl = location.href; setInterval(function() { if (location.href !== lastUrl) { lastUrl = location.href; setTimeout(tryTheater, 500); } }, 1000); // Also try on player load var observer = new MutationObserver(tryTheater); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' GitHub - vi/numdenom: One-file interactive html table builder for data of some numerators with filters divided by denominators with the same filters · GitHub
Skip to content

Repository files navigation

numdenom

Converter from CSV files that have particularly named columns into interactive HTML tables.

formula

Example

$ cat sample.csv
a,b,x_num,x_denom,y_num,y_denom
qqq,t0,3,4,2,5
qqq,t1,3,5,1,2
qqq,t2,1,3,0,6
qqq,t3,4,4,2,4
qqq,t4,0,3,2,9
www,t0,0,0,3,3
www,t1,0,0,3,4
www,t2,0,1,4,4
www,t3,0,0,2,3
www,t5,1,1,4,5
$ ./numdenom.py sample.csv sample.html

screenshot

Algorithm

  1. Read a CSV file and divide all its columns in two types: filter columns and value columns.
  2. Value columns are pairs of columns named x_num and x_denom. They should only contain numbers. Filter columns are all columns not named like *_num or *_denom. Alternatively, there can be just x_num and a common, shared denom column. In the latter case the denom column becomes N column in the output table.
  3. Output a HTML file that contains input file in a compressed form, along with some JavaScript code. The file is self-contained and can be opened using file:// links.
  4. Within the generated page, render all filter columns as combo-boxes on the left side. Each change of the filter settings recalculate the table.
  5. For each value column, calculate the cell value by summing all _num values, then dividing it by the sum of _denom values. Rows not matching the filter settings are excluded from the sums. Special filter setting value _COL promotes filter column to show all its values separately as individual rows.

Value columns are sorted lexicographically. Content of filter columns is also sorted lexicographically. Order of the columns or rows within the CSV file does not matter.

Additional features

  • Cell values are subtly colorised to indicate where the value stands from column minimum to column maximum. Checking the checkbox near value column's name makes colorisation bright instead of subtle.
  • When filtering some rows out, percentage above value column headers indicates share of remaining denominators.
  • When _COL mode is used, averages are displayed at the top.
  • Tool-tip shows specific aggregated numerators and denominators for each cell.
  • Dark theme is supported (should trigger automatically when needed).
  • You can set minimal denominator value to hide cells where aggregated denominator is too low.
  • You can use URL fragment specifier like #b=_COL to provide initial filter settings (and other settings). URL fragment is updated automatically when you change settings.
  • There is a feature to quickly display a chart of some column.
  • Source CSV data can be extracted from the page.
  • You can include additional information into the table as a collapsible section.
  • Special _CHK mode to select multiple filter values using checkboxes.
  • Special _DIST mode to see distribution of N (i.e. denom) as columns.

Limitations

  • Data is assumed to be not big enough. All rows are iterated every time you click on some setting on the page, so the more data you have, the bigger and slower would the resulting html be. Megabyte-sized files do work reasonably well though.
  • Data are assumed to be reasonable, e.g. filter values should not be literally _COL or *. Quotation marks or commas can lead to problems with CSV round-trip.
  • Missing value numbers are turned into 0s.
  • Additional command line arguments (table title and description file) are assumed to be trusted. You can include raw HTML there.
  • In _DIST mode it would be a mess if you select multiple _DIST filters and their values do intersect.

Building and running.

You can download a pre-built numdenom.py from Github releases. The script is self-contained and is expected to depend only on Python's standard library.

Building numdenom.py requires Make and Typescript to be available and is performed by running make in the source code directory.

About

One-file interactive html table builder for data of some numerators with filters divided by denominators with the same filters

Topics

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Remove or un-stick sticky/fixed headers that block content (function() { function unstick() { document.querySelectorAll('header, nav, [role="banner"], .header, .navbar, .sticky, .fixed-top, [style*="position: fixed"], [style*="position:sticky"]').forEach(function(el) { if (el.style.position === 'fixed' || el.style.position === 'sticky' || getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') { el.style.position = 'static'; el.style.top = 'auto'; el.style.zIndex = 'auto'; } }); } unstick(); var observer = new MutationObserver(unstick); observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] }); })(); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' GitHub - vi/numdenom: One-file interactive html table builder for data of some numerators with filters divided by denominators with the same filters · GitHub
Skip to content

Repository files navigation

numdenom

Converter from CSV files that have particularly named columns into interactive HTML tables.

formula

Example

$ cat sample.csv
a,b,x_num,x_denom,y_num,y_denom
qqq,t0,3,4,2,5
qqq,t1,3,5,1,2
qqq,t2,1,3,0,6
qqq,t3,4,4,2,4
qqq,t4,0,3,2,9
www,t0,0,0,3,3
www,t1,0,0,3,4
www,t2,0,1,4,4
www,t3,0,0,2,3
www,t5,1,1,4,5
$ ./numdenom.py sample.csv sample.html

screenshot

Algorithm

  1. Read a CSV file and divide all its columns in two types: filter columns and value columns.
  2. Value columns are pairs of columns named x_num and x_denom. They should only contain numbers. Filter columns are all columns not named like *_num or *_denom. Alternatively, there can be just x_num and a common, shared denom column. In the latter case the denom column becomes N column in the output table.
  3. Output a HTML file that contains input file in a compressed form, along with some JavaScript code. The file is self-contained and can be opened using file:// links.
  4. Within the generated page, render all filter columns as combo-boxes on the left side. Each change of the filter settings recalculate the table.
  5. For each value column, calculate the cell value by summing all _num values, then dividing it by the sum of _denom values. Rows not matching the filter settings are excluded from the sums. Special filter setting value _COL promotes filter column to show all its values separately as individual rows.

Value columns are sorted lexicographically. Content of filter columns is also sorted lexicographically. Order of the columns or rows within the CSV file does not matter.

Additional features

  • Cell values are subtly colorised to indicate where the value stands from column minimum to column maximum. Checking the checkbox near value column's name makes colorisation bright instead of subtle.
  • When filtering some rows out, percentage above value column headers indicates share of remaining denominators.
  • When _COL mode is used, averages are displayed at the top.
  • Tool-tip shows specific aggregated numerators and denominators for each cell.
  • Dark theme is supported (should trigger automatically when needed).
  • You can set minimal denominator value to hide cells where aggregated denominator is too low.
  • You can use URL fragment specifier like #b=_COL to provide initial filter settings (and other settings). URL fragment is updated automatically when you change settings.
  • There is a feature to quickly display a chart of some column.
  • Source CSV data can be extracted from the page.
  • You can include additional information into the table as a collapsible section.
  • Special _CHK mode to select multiple filter values using checkboxes.
  • Special _DIST mode to see distribution of N (i.e. denom) as columns.

Limitations

  • Data is assumed to be not big enough. All rows are iterated every time you click on some setting on the page, so the more data you have, the bigger and slower would the resulting html be. Megabyte-sized files do work reasonably well though.
  • Data are assumed to be reasonable, e.g. filter values should not be literally _COL or *. Quotation marks or commas can lead to problems with CSV round-trip.
  • Missing value numbers are turned into 0s.
  • Additional command line arguments (table title and description file) are assumed to be trusted. You can include raw HTML there.
  • In _DIST mode it would be a mess if you select multiple _DIST filters and their values do intersect.

Building and running.

You can download a pre-built numdenom.py from Github releases. The script is self-contained and is expected to depend only on Python's standard library.

Building numdenom.py requires Make and Typescript to be available and is performed by running make in the source code directory.

About

One-file interactive html table builder for data of some numerators with filters divided by denominators with the same filters

Topics

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Universal Dark Mode - works on any site (function() { var enabled = true; function applyDarkMode() { if (!enabled) return; // Create style element if it doesn't exist var style = document.getElementById('universal-dark-mode-style'); if (!style) { style = document.createElement('style'); style.id = 'universal-dark-mode-style'; document.head.appendChild(style); } // Dark mode CSS - inverts colors but preserves images/video style.textContent = ' /* Invert everything except media */ html { filter: invert(1) hue-rotate(180deg) !important; background: #1a1a2e !important; } /* Restore images, videos, iframes, canvas */ img, video, iframe, canvas, svg, picture, [style*="background-image"] { filter: invert(1) hue-rotate(180deg) !important; } /* Preserve specific elements that should not be inverted */ .no-dark-mode, .no-dark-mode *, [data-theme="light"], [data-theme="light"], .ace_editor, .ace_editor *, .CodeMirror, .CodeMirror *, .monaco-editor, .monaco-editor *, .markdown-body pre, .markdown-body pre *, .highlight, .highlight *, pre code, pre code * { filter: none !important; } /* Fix common UI elements */ .modal, .popup, .dropdown-menu, .tooltip, .popover { filter: invert(1) hue-rotate(180deg) !important; background: #2d2d44 !important; border-color: #444 !important; } /* Scrollbars */ ::-webkit-scrollbar { background: #1a1a2e !important; } ::-webkit-scrollbar-thumb { background: #444 !important; } ::-webkit-scrollbar-thumb:hover { background: #555 !important; } /* Selection */ ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; } ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; } '; } function removeDarkMode() { var style = document.getElementById('universal-dark-mode-style'); if (style) style.remove(); } // Toggle with Alt+Shift+D document.addEventListener('keydown', function(e) { if (e.altKey && e.shiftKey && e.key === 'D') { e.preventDefault(); enabled = !enabled; if (enabled) { applyDarkMode(); console.log('[Universal Dark Mode] Enabled'); } else { removeDarkMode(); console.log('[Universal Dark Mode] Disabled'); } } }); // Apply on load applyDarkMode(); // Re-apply on dynamic content var observer = new MutationObserver(function(mutations) { if (enabled && !document.getElementById('universal-dark-mode-style')) { applyDarkMode(); } }); observer.observe(document.head, { childList: true }); console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle'); })(); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })(); GitHub - vi/numdenom: One-file interactive html table builder for data of some numerators with filters divided by denominators with the same filters · GitHub
Skip to content

Repository files navigation

numdenom

Converter from CSV files that have particularly named columns into interactive HTML tables.

formula

Example

$ cat sample.csv
a,b,x_num,x_denom,y_num,y_denom
qqq,t0,3,4,2,5
qqq,t1,3,5,1,2
qqq,t2,1,3,0,6
qqq,t3,4,4,2,4
qqq,t4,0,3,2,9
www,t0,0,0,3,3
www,t1,0,0,3,4
www,t2,0,1,4,4
www,t3,0,0,2,3
www,t5,1,1,4,5
$ ./numdenom.py sample.csv sample.html

screenshot

Algorithm

  1. Read a CSV file and divide all its columns in two types: filter columns and value columns.
  2. Value columns are pairs of columns named x_num and x_denom. They should only contain numbers. Filter columns are all columns not named like *_num or *_denom. Alternatively, there can be just x_num and a common, shared denom column. In the latter case the denom column becomes N column in the output table.
  3. Output a HTML file that contains input file in a compressed form, along with some JavaScript code. The file is self-contained and can be opened using file:// links.
  4. Within the generated page, render all filter columns as combo-boxes on the left side. Each change of the filter settings recalculate the table.
  5. For each value column, calculate the cell value by summing all _num values, then dividing it by the sum of _denom values. Rows not matching the filter settings are excluded from the sums. Special filter setting value _COL promotes filter column to show all its values separately as individual rows.

Value columns are sorted lexicographically. Content of filter columns is also sorted lexicographically. Order of the columns or rows within the CSV file does not matter.

Additional features

  • Cell values are subtly colorised to indicate where the value stands from column minimum to column maximum. Checking the checkbox near value column's name makes colorisation bright instead of subtle.
  • When filtering some rows out, percentage above value column headers indicates share of remaining denominators.
  • When _COL mode is used, averages are displayed at the top.
  • Tool-tip shows specific aggregated numerators and denominators for each cell.
  • Dark theme is supported (should trigger automatically when needed).
  • You can set minimal denominator value to hide cells where aggregated denominator is too low.
  • You can use URL fragment specifier like #b=_COL to provide initial filter settings (and other settings). URL fragment is updated automatically when you change settings.
  • There is a feature to quickly display a chart of some column.
  • Source CSV data can be extracted from the page.
  • You can include additional information into the table as a collapsible section.
  • Special _CHK mode to select multiple filter values using checkboxes.
  • Special _DIST mode to see distribution of N (i.e. denom) as columns.

Limitations

  • Data is assumed to be not big enough. All rows are iterated every time you click on some setting on the page, so the more data you have, the bigger and slower would the resulting html be. Megabyte-sized files do work reasonably well though.
  • Data are assumed to be reasonable, e.g. filter values should not be literally _COL or *. Quotation marks or commas can lead to problems with CSV round-trip.
  • Missing value numbers are turned into 0s.
  • Additional command line arguments (table title and description file) are assumed to be trusted. You can include raw HTML there.
  • In _DIST mode it would be a mess if you select multiple _DIST filters and their values do intersect.

Building and running.

You can download a pre-built numdenom.py from Github releases. The script is self-contained and is expected to depend only on Python's standard library.

Building numdenom.py requires Make and Typescript to be available and is performed by running make in the source code directory.

About

One-file interactive html table builder for data of some numerators with filters divided by denominators with the same filters

Topics

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages