35 Nástroje, skripty a zásuvné moduly pro vytvoření krásných tabulek HTML

Vizualizace dat je klíčem k lepšímu porozumění objemným nebo komplikovaným informacím. Existuje mnoho způsobů, jak vizualizujte svá data tj. můžete navrhnout chladné infografiky nebo vytvořit interaktivní grafy ‐ vše závisí na vašich datech a na tom, jak jej chcete prezentovat.

Můj dnešní příspěvek je však pouze na téma tabulek a některé opravdu užitečné zdroje pro vytváření různých typů tabulek. Zde je 35 tipů, nástrojů, skriptů a pluginů, které vám pomohou vytvořit různé tabulky, které budou prezentovat vaše data. Pojďme tedy podrobně diskutovat o každém zdroji.

Tabulka jQuery Snippets

Tyto šikovné kousky spolu s jednoduchým vysvětlením vám pomohou vytvořit interaktivní tabulky. Tyto úryvky například umožňují dynamické přidávání řádků, načítání hodnot buněk atd.

Stylingové tabulky

Sada tipů a triků, které pomáhají efektivně upravovat tabulky tím, že zlepšují jejich uspořádání, typografii, zarovnání textu a mnoho dalšího. Navíc to také vypráví přidávání barev a grafiky a přizpůsobení titulků spolu s dalšími aspekty tabulky.

Žádné další tabulky

Úryvek, který vám pomůže vytvořit mobilní responzivní tabulky, které zobrazují každý řádek zvlášť na malých obrazovkách. Také můžete pomocí CSS změnit barvu, písmo a velikost písma atd.

Posuvné těleso stolu

Tento trik může posouvat vaše tělo tabulky - funkce, která se nachází ve většině nástrojů tabulkového procesoru, jako jsou například listy Google. To znamená, že můžete opravit záhlaví tabulky a tělo nebo obsah tabulky se posouvá, jako obvykle, aby byl stůl viditelnější než dříve.

Pevná tabulka záhlaví

Další trik jako výše, Fixed Table Header pomáhá vytvořit tabulku s pevným záhlavím a rolovacím obsahem. Můžeš přizpůsobit tabulku včetně barev a písem, ale tento trik není tak podrobný a vysvětlen jako Posouvatelný Tělo Tabulky.

Zvýraznění tabulky čistého CSS

Jednoduchý trik, který vám umožní zvýrazněte konkrétní buňku na přechodu - vertikálně i horizontálně. Poslední tabulka je také přizpůsobitelná pomocí vlastních barev a písem. Zjistil jsem, že tento trik je nejužitečnější, když potřebujete zobrazit čísla na stole.

TABLEIZER!

TABLEIZER! je online nástroj, který vám umožní vytvářet prosté tabulky v HTML pomocí dat z Excelu, Google Sheets, nebo jakýkoli jiný nástroj tabulkového procesoru. Poslední tabulku můžete také přizpůsobit pomocí CSS, stejně jako všechny ostatní tabulky v HTML.

Generátor tabulek HTML

Generátor tabulek HTML je jednoduchý generátor tabulek, který vám pomůže vytvářet a upravovat téměř každý aspekt tabulky pomocí možností na obrazovce. Líbí se mi, že můžete vytvořit tabulku ručně, nahrát soubor CSV nebo importovat data z nástroje tabulkového procesoru, například aplikace Excel. Tabulku můžete také vytvořit výběrem motivu ze sady šablon.

Quackit HTML generátor tabulek

Další online generátor tabulek, který vám pomůže vytvořit tabulky se sadou možností přizpůsobitelnosti. Styl možnosti zahrnují velikost, barvu, ohraničení, atd. Nicméně chybí možnost importu dat, na rozdíl od výše uvedeného generátoru tabulek.

Rychlé tabulky HTML Generátor tabulek

Generátor tabulek HTML pomocí tabulek Rapid je dalším nástrojem, jako je výše uvedený nástroj. Poskytuje více možností přizpůsobení než výše uvedený nástroj, jako je velikost, ohraničení, barva, zarovnání a některé další. Nicméně, stejně jako výše uvedený nástroj, podporuje pouze vytvoření tabulky ručně a neumožňuje import souborů nebo data z nástroje tabulkového procesoru, jako je Google Docs.

HTML tabulka Styler

Nástroj pro přizpůsobení tabulek, HTML tabulka Styler, umožňuje styl tabulek pomocí možnosti na obrazovce, které generují CSS pro vaši tabulku v HTML. Tento nástroj překvapivě zobrazuje živý náhled tabulky, který vám umožní otestovat a vyzkoušet možnosti stylingu. Také nabízí témata pro rychlou úpravu tabulky, které si můžete také přizpůsobit.

Nástroje konverze

Nástroje konverze jsou užitečné webové stránky pro každého, kdo se denně zabývá tabulkami a tabulkami. Pomáhá vám převést tabulku HTML na soubor CSV, soubor aplikace Excel do tabulky HTML, soubor aplikace Excel do souboru CSV a provést mnohem více konverzí.

HTML tabulka pro převodník Div

Online převodník nástroj, HTML tabulka Div Converter umožňuje převést tradiční tabulky na div tabulky, tj. Tabulky vytvořené pomocí prvků 'div'. Vše, co musíte udělat, je zkopírujte a vložte tabulku na její stránku a stiskněte tlačítko Převést pro vygenerování tabulky div.

Ruční

Handsontable je inovativní komponenta tabulkového procesoru pro webové aplikace který vám umožní rychle vyvíjet a nabízet tabulky ve vašich aplikacích. Nabízí širokou škálu funkcí, jako je podpora pro více rámců, vysoký výkon s masivním množstvím dat, potřebné funkce, jako je vyhledávání, filtrování atd., což umožňuje vývojářům rychle stavět.

Dynatable.js

Interaktivní tabulkový plugin, Dynatable.js používá HTML, jQuery a JSON k vytvoření tabulek a dalších tabulkových struktur. Můžete vytvářet tabulky přímo z JSON a zahrnovat všechny základní funkce, jako je vyhledávání, filtr, počet záznamů a stránkování.

Spouštěcí tabulka

Bootstrap Table je rozšířená verze tabulky, kterou nabízí Bootstrap. Minimalizuje čas a úsilí při vytváření tabulek a poskytuje citlivý design. Přináší funkce jako rolovací a pevné hlavičky a funkce jako řazení, stránkování, atd.

List.js

List.js je jednoduchý a výkonný JavaScript plugin, který umožňuje vytvářet seznamy a tabulky s flexibilitou a funkcemi, jako je filtr, vyhledávání a třídění, atd. Líbilo se mi, že je postaven pomocí JavaScriptu JavaScriptu, takže nevyžadujete žádnou knihovnu třetích stran.

jExcel

jExcel je lehký jQuery plugin, který vám umožní vložíte do své webové stránky libovolnou tabulku kompatibilní s aplikací Excel. Zásuvný modul pomáhá vytvářet tabulku podobnou aplikaci Excel, která vám umožňuje přesouvat, měnit velikost, kopírovat, vkládat a provádět mnohem více s daty listu..

Datové tabulky

Super flexibilní plugin pro jQuery, datové tabulky vám umožní přidat pokročilé ovládací prvky interakce do libovolné tabulky HTML. To vám pomůže přidat stránkování, vyhledávací funkce, motivy, atd. Také poskytuje velké množství rozšíření přidat další funkce.

jQuery Bootgrid

jQuery Bootgrid je elegantní a intuitivní plugin pro vytváření a správu sítí, jako jsou tabulky. Poskytuje funkce jako vyhledávání, stránkování atd. Spolu s přizpůsobitelnými šablonami.

jQuery-Tabledit

jQuery-Tabledit je online editor pro Bootstrap kompatibilní HTML tabulky, které umožňují uživatelům editovat data v tabulkách. Můžete poskytnout Přepíná mezi režimem zobrazení a úprav, zahrnují tlačítka pro odstranění a obnovení a přizpůsobení tabulek pomocí CSS.

jsGrid

jsGrid je lehký plugin jQuery, který pomáhá vytvářet a spravovat datové sítě. Podporuje různé operace na mřížkách, jako je filtrování, stránkování, třídění atd. Umožňuje také přizpůsobit vzhled tabulky a podporuje internacionalizaci také.

Chytrý stůl

Robustní knihovna Smart Table vám pomůže transformovat jakoukoliv tabulku HTML na chytřejší s podobnými možnostmi filtrovat, hledat, třídit, atd. Je spojen s více funkcemi, které pomáhají budovat užitečné a profesionálně vypadající tabulky nebo datové mřížky s pluginy.

HighchartTable

HighchartTable automaticky převádí tabulky HTML na grafy a grafy. Je ideální reprezentovat analytiku projektu a statistiky v grafech spolu s číselnými údaji v tabulkách.

TableExport

TableExport je jednoduchá knihovna exportovat tabulku HTML do souborů CSV, TXT nebo Excel. Pomocí této knihovny můžete snadno vytvářet tabulky pomocí funkce exportu do souboru.

Tabulátor

Tabulátor je plugin pro jQuery vytváření interaktivních tabulek z HTML tabulky, JavaScript pole, JSON, atd. Podporuje téměř všechny standardní tabulky funkcí, jako je vyhledávání, třídění, filtr, atd. a nabízí mnoho funkcí, jako je a zpětné volání a lokalizace.

FancyGrid

Knihovna mřížek, FancyGrid umožňuje vytvářet krásné tabulky spolu s grafy a grafy. Podporuje mnoho zdrojů dat včetně JSON, zahrnuje různé funkce, jako je třídění, vyhledávání, atd., Umožňuje a modularizace a přináší mnoho dalších funkcí.

KingTable

KingTable vám umožní stavět administrativní tabulky s minimálním kódováním. Dodává se s pozoruhodným množstvím funkcí, včetně vyhledávání na straně klienta nebo serveru, třídění, filtrování a dalších běžných funkcí. Můžete přizpůsobit vzhled a dojem z tabulky, přidávat vlastní filtry a exportovat data do různých formátů jako CSV, JSON a Excel.

stacktable.js

JQuery plugin pro tabulky, stacktable.js vám umožní převést všechny širokoúhlé tabulky na tabulku klíčů / hodnot 2 sloupců. Je ideálním řešením pro zobrazení velkých tabulek na malých obrazovkách, jako jsou mobilní zařízení. V případě potřeby můžete také řadit řádky nebo sloupce.

Tabella.js

Tabella.js vám pomáhá vytvářet responzivní tabulky s pevnými záhlavími a rolovatelnými daty - dokonce i horizontálně, aby obsahoval mnoho sloupců, než je obvykle možné. Navíc můžete obsahovat více tabulek na stejné stránce a také vytvořit víceúčelové tabulky.

TablePress

TablePress je fantastický plugin pro WordPress, který vám umožní vytvářet a vkládat tabulky do příspěvků, stránek a widgetů pomocí krátkého kódu. Tabulky lze upravovat v tabulkovém rozhraní a mohou obsahovat všechny typy dat včetně vzorců. Můžete také přidat funkce, jako je vyhledávání a třídění a export dat do různých formátů.

Generátory datových tabulek podle Supsystic

Generátor datových tabulek pomáhá při vytváření a správě tabulek přímo z administračního panelu pomocí editoru frontendových tabulek. Překvapivě můžete také zahrnout grafy a grafy v tabulkách spolu s titulky, záhlavím a zápatím. Zajímavější je, že tabulky jsou plně editovatelné a exportovatelné do formátu CSV, Excel nebo PDF.

Tabulka cen podle Supsystic

Další plugin Supsystic, Cenová tabulka umožňuje vytvářet cenové tabulky bez jakýchkoliv překážek. Můžeš vyberte šablonu, upravte cenový obsah a publikujte ji na svém WordPressu. Tabulky vytvořené pomocí tohoto pluginu jsou také citlivé a elegantní na všech zařízeních.

Reagující tabulka Magic Liquidizer

Tabulkový plugin pro WordPress, Magic Liquidizer Responsive Table transformuje libovolnou běžnou tabulku na mobilní responzivní tabulku. Do tabulek můžete vkládat obrázky, texty atd. A zobrazovat je stejně jako u všech zařízení - dokonce i u malých obrazovek.

Kopírování

Copytables je rozšíření pro Google Chrome, které umožňuje kopírování tabulek z webových stránek. Můžeš vyberte buňky tabulky, řádky nebo sloupce na libovolné webové stránce a zkopírujte je přímo .