{"id":19401932,"url":"https://github.com/thwillert/tableminmax","last_synced_at":"2026-02-08T17:02:59.501Z","repository":{"id":56663324,"uuid":"303099954","full_name":"THWillert/tableMinMax","owner":"THWillert","description":"JavaScript that colors the min / max values of a HTML table.","archived":false,"fork":false,"pushed_at":"2024-09-07T09:35:04.000Z","size":137,"stargazers_count":2,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-07-18T17:35:17.090Z","etag":null,"topics":["color","colour","css","html","javascript","jquery","maximum","minimum","table"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/THWillert.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGES.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-10-11T10:57:43.000Z","updated_at":"2024-09-07T09:35:07.000Z","dependencies_parsed_at":"2024-11-10T11:22:47.291Z","dependency_job_id":"44470b86-d5e2-4940-aed6-2ec4a3cb7fc2","html_url":"https://github.com/THWillert/tableMinMax","commit_stats":null,"previous_names":[],"tags_count":13,"template":false,"template_full_name":null,"purl":"pkg:github/THWillert/tableMinMax","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/THWillert%2FtableMinMax","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/THWillert%2FtableMinMax/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/THWillert%2FtableMinMax/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/THWillert%2FtableMinMax/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/THWillert","download_url":"https://codeload.github.com/THWillert/tableMinMax/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/THWillert%2FtableMinMax/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29237109,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-08T14:18:14.570Z","status":"ssl_error","status_checked_at":"2026-02-08T14:18:14.071Z","response_time":57,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["color","colour","css","html","javascript","jquery","maximum","minimum","table"],"created_at":"2024-11-10T11:20:43.251Z","updated_at":"2026-02-08T17:02:59.487Z","avatar_url":"https://github.com/THWillert.png","language":"JavaScript","readme":"# tableMinMax\n\n## Overview\n\nThe `tableMinMax` function allows you to highlight cells with minimum and maximum values in a table. You can configure the appearance and behavior of the highlighting through various parameters.\n\n\nDie Funktion `tableMinMax` ermöglicht das Markieren von Zellen mit den minimalen und maximalen Werten in einer Tabelle. Sie können die Darstellung und das Verhalten der Markierung über verschiedene Parameter konfigurieren.\n\n____\n\n![Ergebnis](https://www.thorsten-willert.de/images/Software/JavaScript/Thorsten_H_Willert_-_JavaScript_tableMinMax_Beispiel-Tabelle.png)\n\n### Features\n\n- Werte in einzelner Spalte markieren\n- Werte in einzelne Reihe markieren\n- Werte der gesamten Tabelle markieren\n- Mehrere Spalten oder Zeilen gleichzeitig markieren\n- Werte über Gruppen von Zeilen oder Spalten hinweg markieren\n- Werte in allen Zeilen/Saplten markieren, wobei jede Zeile/Spalte einzeln berechnet wird.\n- Zelle komplett (CELL) oder SPAN (mit Werten)  markieren.\n- Durch mehrfachen Aufruf, lassen sich auch Zeilen und Spalten bzw. gleichzeitg Min/Max der gesamten Tabelle markieren.\n- Übergabe von CSS-Klassen\n- Übergabe der Parameter (teilweise) per DATA-Attribut.\n- Rückgabe der Min/Max Werte als Array.\n- Die Text-Farbe (schwarz/weis) wird automatisch an die Hintergrund-Farbe angepaßt.\n\n___\n\n## Voraussetzungen\n\nDas Script muss am Ende der Seite aufgerufen werden, oder z. B. bei Verwendung von **jQuery** innerhalb von\n``` JavaScript\n$(document).ready(function() {\n});\n```\n\nWird die Tabelle per Script aufgebaut, muß diese vollständig sein, bevor die Funktion gestartet wird.\n\nZ. B. Aufruf in **Datatables** im Callback \"initComplete\".\n\n## Beispiele\n\nCSS:\n``` CSS\n.mSpan { display: inline-block; padding: .1em; min-width: 4em; border-radius: .3em; }\n.min { background-color: #DF0101; color: white; }\n.max { background-color: #01DFA4; color: black; }\n```\n\nAufruf per DATA-\n``` html\n \u003ctable id=\"example1\"\n    data-search-mode=\"all\"\n    data-css-min=\"min mSpan\"\n    data-css-max=\"max mSpan\"\u003e\n        \u003cthead\u003e\n            \u003ctr\u003e\n                \u003cth\u003e1\u003c/th\u003e\n                \u003cth\u003e2\u003c/th\u003e\n                \u003cth\u003e3\u003c/th\u003e\n                \u003cth\u003e4\u003c/th\u003e\n                \u003cth\u003e5\u003c/th\u003e\n                \u003cth\u003e6\u003c/th\u003e\n            \u003c/tr\u003e\n        \u003c/thead\u003e\n        \u003ctbody\u003e\n            \u003ctr\u003e\n                \u003ctd\u003e3435\u003c/td\u003e\n                \u003ctd\u003e234\u003c/td\u003e\n                \u003ctd\u003e567\u003c/td\u003e\n                \u003ctd\u003e87\u003c/td\u003e\n                \u003ctd\u003e234\u003c/td\u003e\n                \u003ctd\u003e432\u003c/td\u003e\n            \u003c/tr\u003e\n...\n```\n``` JavaScript\ntableMinMax({\n  \"table\": \"#example1\"\n});\n```\n____\n\nAufruf über Optionen:\n``` html\n\u003ctable id=\"example2\"\u003e\n        \u003cthead\u003e\n            \u003ctr\u003e\n                \u003cth\u003e1\u003c/th\u003e\n                \u003cth\u003e2\u003c/th\u003e\n                \u003cth\u003e3\u003c/th\u003e\n                \u003cth\u003e4\u003c/th\u003e\n                \u003cth\u003e5\u003c/th\u003e\n                \u003cth\u003e6\u003c/th\u003e\n            \u003c/tr\u003e\n        \u003c/thead\u003e\n        \u003ctbody\u003e\n            \u003ctr\u003e\n                \u003ctd\u003e35\u003c/td\u003e\n                \u003ctd\u003e234\u003c/td\u003e\n                \u003ctd\u003e567\u003c/td\u003e\n                \u003ctd\u003e87\u003c/td\u003e\n                \u003ctd\u003e234\u003c/td\u003e\n                \u003ctd\u003e432\u003c/td\u003e\n            \u003c/tr\u003e\n...\n```\n``` JavaScript\ntableMinMax({\n  \"table\": \"#example2\",\n    \"css\": {\n      \"min\": \"minT\",\n      \"max\": \"maxT\"\n    },\n  \"colorize\": \"cell\"\n});\n```\n\u003e \n\u003e Optionen über Data-Attribut überschreiben die Parameter beim Funktionsaufruf.\n\n### Parameter\n\n- **`table`**: CSS-Selektor für die Ziel-Tabelle. Standardmäßig `'table'`.\n- **`search.mode`**: Modus der Suche, entweder `'all'` (alle Zellen in der Tabelle), `'row'` (nur Zeilen) oder `'col'` (nur Spalten). Standardmäßig `'all'`.\n- **`search.nr`**: Array von Zeilen- oder Spaltennummern, die durchsucht werden sollen. Standardmäßig `[1]`.\n- **`search.grouped`**: Ob Min/Max-Werte über alle ausgewählten Zeilen/Spalten aggregiert werden sollen. Standardmäßig `false`.\n- **`css.mode`**: Modus zum Anwenden von CSS, entweder `'style'` oder `'class'`. Standardmäßig `'style'`.\n- **`css.max`**: CSS-Klasse oder Stil für das maximale Element. Standardmäßig leer.\n- **`css.min`**: CSS-Klasse oder Stil für das minimale Element. Standardmäßig leer.\n- **`text.autocontrast`**: Ob die Textfarbe automatisch an den Hintergrund angepasst werden soll. Standardmäßig `true`.\n- **`text.threshold`**: Kontrastschwelle für die Textfarbe. Standardmäßig `130`.\n- **`text.light`**: Helle Textfarbe. Standardmäßig `'#fff'`.\n- **`text.dark`**: Dunkle Textfarbe. Standardmäßig `'#000'`.\n- **`colorize`**: Wie CSS angewendet wird, entweder `'span'` (über span-Elemente) oder `'cell'` (direkt auf die Zellen). Standardmäßig `'span'`.\n- **`mode`**: Modus zum Markieren von Min/Max, entweder `'single'` (einzelne Markierung) oder `'multi'` (mehrere Markierungen). Standardmäßig `'single'`.\n- **`invert`**: Ob Min- und Max-Klassen vertauscht werden sollen. Standardmäßig `false`.\n\n### Beispiel\n\n```javascript\ntableMinMax({\n    table: '#myTable',\n    search: {\n        mode: 'col',\n        nr: [0, 1],\n        grouped: true\n    },\n    css: {\n        mode: 'class',\n        max: 'highlight-max',\n        min: 'highlight-min'\n    },\n    text: {\n        autocontrast: true,\n        threshold: 140,\n        light: '#fff',\n        dark: '#000'\n    },\n    colorize: 'cell',\n    mode: 'multi',\n    invert: false\n});\n```\n___\n\n### Parameters\n\n- **`table`**: CSS selector for the target table. Default is `'table'`.\n- **`search.mode`**: Search mode, either `'all'` (all cells in the table), `'row'` (only rows), or `'col'` (only columns). Default is `'all'`.\n- **`search.nr`**: Array of row or column numbers to search in. Default is `[1]`.\n- **`search.grouped`**: Whether to aggregate min/max values across all selected rows/columns. Default is `false`.\n- **`css.mode`**: Mode of applying CSS, either `'style'` or `'class'`. Default is `'style'`.\n- **`css.max`**: CSS class or style for the maximum value. Default is empty.\n- **`css.min`**: CSS class or style for the minimum value. Default is empty.\n- **`text.autocontrast`**: Whether to automatically adjust the text color based on contrast. Default is `true`.\n- **`text.threshold`**: Contrast threshold for text color. Default is `130`.\n- **`text.light`**: Light text color. Default is `'#fff'`.\n- **`text.dark`**: Dark text color. Default is `'#000'`.\n- **`colorize`**: How CSS is applied, either `'span'` (through span elements) or `'cell'` (directly on the cells). Default is `'span'`.\n- **`mode`**: Mode for marking min/max, either `'single'` (single marking) or `'multi'` (multiple markings). Default is `'single'`.\n- **`invert`**: Whether to swap min and max CSS classes. Default is `false`.\n\n### Example\n\n```javascript\ntableMinMax({\n    table: '#myTable',\n    search: {\n        mode: 'col',\n        nr: [0, 1],\n        grouped: true\n    },\n    css: {\n        mode: 'class',\n        max: 'highlight-max',\n        min: 'highlight-min'\n    },\n    text: {\n        autocontrast: true,\n        threshold: 140,\n        light: '#fff',\n        dark: '#000'\n    },\n    colorize: 'cell',\n    mode: 'multi',\n    invert: false\n});\n```\n___\n\n## ToDo\n\n- [x] Abhängkeit von jQuery entfernen\n- [x] Mehrere Spalten / Reihen gleichzeitig übergeben\n- [x] Abhängigkeit von color2k entfernen\n- [X] gleiche Werte ebenfalls markieren\n- [ ] Werte unterhalb und / oder über Grenzwerten markieren\n- [ ] Alle Parameter überprüfen\n ___\n\n## Author\nThorsten Willert\n\n[Homepage](https://www.thorsten-willert.de/software/javascript/tableminmax)\n\n## Lizenz\nDas ganze steht unter der [MIT](https://github.com/THWillert/tableMinMax/blob/master/LICENSE) Lizenz.\n\n\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthwillert%2Ftableminmax","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fthwillert%2Ftableminmax","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthwillert%2Ftableminmax/lists"}