Vytvořit grafy s podporou JavaScriptu s Billboard.js

Grafika a vizualizace hrají zásadní roli při zlepšování obsahu webu. S moderní technologií je tak snadné přidat vlastní vizualizace, jako jsou ikony SVG, na stránku.

Další překvapující vizuální obraz, který můžete vytvořit od nuly, je webový graf.

To vám může pomoci graficky vizualizujte data tak vaši návštěvníci mohou rychle sbírat příslušné informace. A namísto kódování grafu můžete použít knihovnu jako Billboard.js, abyste mohli provést všechny těžké zvedání.

Toto je vlastně postaveno na vrcholu D3, což je knihovna pro vizualizaci dat JavaScriptu. Je to nejoblíbenější z nich, což je nejbezpečnější závislost, kterou byste mohli požádat.

S Billboard.js můžete rychle a snadno přistupovat k D3 API. Hlavním cílem Billboardu je snadné použití, zpřístupnění pro každého. I když to pomůže mít nějaké zkušenosti s JavaScript, určitě nemusíte být expert.

Všimněte si, že celá kódová databáze používá syntaxi ES6, která může být matoucí pro méně zkušené devizy JS.

Tak dlouho jako ty vědět, jak kód zkompilovat měli byste být v pořádku. Pokud se chcete dozvědět více, vlastně jsme pokryli několik horkých funkcí z ES6.

Všechny technické podrobnosti o tomto pluginu se mohou zdát pěkné. Ale asi to chceš vědět co to může udělat.

Podívejte se na demo stránku a klikněte na některé z živých příkladů.

Najdete zde vše od koláčových grafů až po rozptylové grafy a vlastní animované sloupcové grafy.

S Billboard.js máte plnou kontrolu nad vašimi daty. Řídíte, jak se bude zobrazovat na stránce, jak je strukturován a jaký typ přidávaných funkcí uživatelského rozhraní nebo uživatelského rozhraní (pokud existují).

Je to opravdu fantastická knihovna map a je to jeden z nejjednodušších vyzvednutí. Podívejte se na repo projektu projektu GitHub, kde se dozvíte více.

Můžete také kopat do tohoto fragmentu na CodePen, pokud chcete hračku s kódem ve vašem prohlížeči.