Wykres Divi
Piękne wykresy
DoDiwi 5
Dodaj oszałamiające, interaktywne wizualizacje danych do dowolnej strony Divi — nie wymaga kodowania. Obsługiwany przez Chart.js, w pełni responsywny i głęboko zintegrowany z Divi 5 Visual Builder.
Typy wykresów
Każdy wykres, jakiego kiedykolwiek będziesz potrzebować
Od klasycznych wykresów słupkowych po diagramy radarowe,Wykres Divizapewnia osiem różnych typów wizualizacji od razu po wyjęciu z pudełka.
Pasek (kolumna)
Klasyczne pionowe słupki, idealne do porównywania kategorii obok siebie.
Pasek (poziomy)
Odwrócone paski dla długich etykiet lub rankingów — łatwe do odczytania.
Linia
Śledź trendy w czasie za pomocą płynnych wykresów liniowych zawierających wiele zestawów danych.
Obszar
Wypełnione wykresy liniowe podkreślające wolumen i wartości skumulowane.
Ciasto
Szybkie wyświetlanie proporcji dzięki w pełni konfigurowalnym kolorom plasterków.
Pączek
Nowoczesna wersja ciasta — idealna do pulpitów nawigacyjnych i wyświetlaczy wskaźników KPI.
Radar
Porównaj wiele atrybutów w kilku zbiorach danych w jednej pajęczej sieci.
Obszar polarny
Segmenty promieniowe dobierane według wartości — atrakcyjne, bogate w dane i niepowtarzalne.
Dlaczego to wybrać
Wszystko, czego potrzebujesz, nic, czego nie potrzebujesz
Podgląd narzędzia Visual Builder na żywo
Każda zmiana dokonana w panelu Divi 5 jest natychmiast odzwierciedlana na płótnie — bez odświeżania strony, bez zgadywania.
8 indywidualnych selektorów kolorów plasterków
Wykresy kołowe, pączkowe i polarne umożliwiają ustawienie odrębnego koloru dla każdego plasterka za pomocą natywnych selektorów kolorów Divi — spójnych w edytorze i interfejsie użytkownika.
Do 3 zestawów danych
Nakładaj wiele serii danych na wykresy słupkowe, liniowe, obszarowe i radarowe, aby uzyskać bogate, porównawcze wizualizacje.
W pełni responsywny
Wykresy zmieniają rozmiar płynnie na dowolnym rozmiarze ekranu. Ustaw preferowaną wysokość w pikselach, a Chart.js zajmie się resztą.
Płynne animacje
Konfigurowalny czas trwania animacji (0–3000 ms) zapewnia dopracowany efekt odsłonięcia za każdym razem, gdy wykres pojawia się w rzutni.
Interaktywna legenda
Kliknij dowolny element legendy, aby pokazać lub ukryć ten zbiór danych. Informacje zwrotne od kursora wskaźnika sprawiają, że wykrywalność jest oczywista dla użytkowników końcowych.
Etykiety osi
Add descriptive X and Y axis labels directly from the Design panel to give your data the context it deserves.
100% WordPress Standards
PHPCS-clean code following the WordPress coding standard, PSR-4 autoloading, and zero legacy Divi module API — built for the long term.
Module Settings
Deep customisation, zero complexity
All settings live inside the familiar Divi panel, organised into clear groups so you always know where to look.
Chart Settings
- Chart type (8 options)
- Chart title
- Category labels (comma-separated)
Slice Colors
- 8 individual color pickers
- Applied to Pie, Donut & Polar Area
- Consistent VB ↔ frontend rendering
Dataset 1
- Label, values (comma-separated)
- Color picker
- Fill opacity (Line & Area)
Datasets 2 & 3 (Optional)
- Toggle on/off independently
- Label, values, color picker
- Stacks on Bar, Line, Area, Radar
Chart Style
- Height (150 – 900 px)
- Background color
- Show / hide legend + position
- Show / hide grid lines
- Animation duration (ms)
- Border / line width (px)
- Point radius (Line & Area)
Etykiety osi
- X-axis label text
- Y-axis label text
Requirements
Works right out of the box
Install, activate, and drag the Graph & Chart module into any Divi 5 page. No extra libraries to install — Chart.js is loaded automatically from CDN.