Umieszczanie wykresów na stronach www

Data aktualizacji: 22.04.2024r. Autor: Bartosz Stefanicki.

Umieszczanie wykresów na stronach www

Wklejanie grafik i tabel na strony internetowe jest coraz popularniejsze. Czemu nie przedstawić danych w formie eleganckiego wykresu?

Sposobów na uzyskanie wykresu jest sporo. Na rynku dostępnych jest wiele rozwiązań, w tym bezpłatnych. Poniżej przedstawiam kilka z nich, które zwróciły moją uwagę. Tego typu rozwiązania pozwalają na zautomatyzowanie generowania wykresów, od tych najprostszych do bardziej zaawansowanych.

1. ChartJS

Zestawienie rozpocznę od ChartJS, który odrazu mi się spodobał. Jest to biblioteka JavaScript, dzięki której możemy wygenerować grafiki przyciągające wzrok. Korzysta z HTML5 Canvas, wspiera nowoczesne przeglądarki (w tym Internet Explorer od wersji 9). Jest lekki, waży około 11KB. Warto także wspomnieć, że ChartJS generuje responsywne wykresy, czyli dopasowujące się do ekranu użytkownika.

Strona internetowa: chartjs.org
Licencja: MIT

2. CanvasJS

Umożliwia szybkie generowanie wykresów, które są responsywne - można z nich korzystać na urządzeniach mobilnych. Ma proste API, możliwe jest tworzenie bogatych paneli zarządzania. Posiada wiele schematów graficznych. Zdaniem twórcy CanvasJS jest 10 razy szybsze w porównaniu do Flasha.

Strona internetowa: canvasjs.com
Licencja: canvasjs.com/license-canvasjs

3. Google Chart API

Firma Google również pokusiła się o stworzenie własnej klasy do obsługi wykresów. Rozbudowany kod pozwala na wygenerowanie wykresów: kołowych w 2D i 3D, liniowych, słupkowych, kardioidalnych oraz punktowych. Dostępnych jest 18 typów wykresów. Przy tym wszystko jest przyjazne dla użytkownika - Google wykorzystuje dane ze zmiennych, dzięki czemu nie ma konieczności edytowania plików. Klasa Google API Chart posiada własną dokumentację.

Strona internetowa: developers.google.com/chart/
Licencja: developers.google.com/chart/terms

4. Plottable

Plottable JS to prosta biblioteka. Umożliwia tworzenie prostych wykresów.

Strona internetowa: plottablejs.org
Licencja: MIT

5. eJS Chart

To otwarto źródłowe rozwiązanie. Wspiera najpopularniejsze przeglądarki Internet Explorer (od wersji 6), Mozilla Firefox, Safari, Chrome. Dostępnych jest kilka najczęściej używanych typów wykresów.

Strona internetowa: ejschart.com
Licencja: Open Source

6. Mniejsze projekty

Chartist
Wyróżnia się prostą i lekką biblioteką ważącą około 10KB.

plot.ly
Jedna z najbardziej zaawansowanych bibliotek, 20 typów wykresów, w tym wykresy 3D.

Am Charts
Zaawansowana propozycja, responsywna i zgodna ze standardami.

LibChart
Wykresy dwuwymiarowe i trójwymiarowe: słupkowe, liniowe, kołowe. Dane wprowadza się do pliku. Wymagania: PHP, GD. Licencja: GNU General Public License (GPL).

A definition list bar chart Popularna biblioteka do tworzenia animowanych, responsywnych wykresów. Prosty generator wykresów słupkowych dwuwymiarowych. Wymagania: JavaScript.

Flash charts by amcharts
Prosty generator wykresów kołowych dwuwymiarowych i trójwymiarowych a także liniowych etc. Od pozostałych wyróżnia się dodatkową, ciekawą animacją. Wymagania: JavaScript.

ChartDemo (WebFX)
Prosty generator wykresów słupkowych, liniowych dwuwymiarowych. Wymagania: JavaScript. Działa pod przeglądarkami - Firefox 1.5+, Opera 9.0+, IE6+.

Kategorie: HTML + CSS. Tagi: #ajax, #css, #grafika, #html, #wykresy. Źródło obrazków: Pixabay, Font awesome.

Zobacz także

5 komentarzy