Визуализация больших наборов данных с помощью wpDataTables: практическое руководство

Опубликовано: 2023-05-03

Визуализация больших наборов данных является огромной проблемой. Представление их в ясной и убедительной форме является одним из наиболее востребованных методов визуализации данных. Вашей аудитории нужно что-то интерактивное, легкое для понимания и отзывчивое. Существуют способы создания таких визуализаций, не тратя много часов или много денег на дорогостоящие инструменты визуализации данных.

wpDataTables — это надежный инструмент визуализации данных, который вам понравится. Вы делаете все виды графиков и диаграмм с ним. Он специализируется на обработке больших данных и превращении их в презентации, которые понравятся вашей аудитории.

Этот плагин WordPress обрабатывает все виды организованных и иерархических форматов данных, таких как:

  • CSV
  • Excel
  • Google Таблицы
  • JSON
  • MySQL
  • PostgreSQL
  • XML

Он имеет встроенный редактор графиков и диаграмм для настройки представления данных. Стандартно он создает различные диаграммы, в том числе:

  • Диаграммы с областями
  • Гистограммы
  • Пузырьковые диаграммы
  • Столбчатые диаграммы
  • Кольцевые диаграммы
  • Калибровочные диаграммы
  • Линейные графики
  • Круговые диаграммы
  • Точечные диаграммы

Итак, понятно, почему wpDataTables такой классный инструмент . Эта статья покажет вам, как вы можете использовать его для визуализации больших наборов данных в WordPress и публикации их на своем веб-сайте.

Использование wpDataTables для визуализации больших наборов данных

Установка и активация wpDataTables

Первый шаг очевиден: для начала вам необходимо установить плагин wpDataTables. Это очень легко сделать, зайдя в репозиторий плагинов WordPress .

Для этого откройте WordPress и перейдите в раздел «Добавить новый» в разделе «Плагины» . Здесь вы можете искать wpDataTables. Затем следуйте инструкциям на экране и завершите установку и активацию.

Импорт данных

После установки вы можете импортировать данные в wpDataTables из различных источников . Некоторые из вариантов импорта данных:

  • CSV
  • Excel
  • Google Таблицы
  • JSON
  • MySQL-запросы
  • Сериализованный массив PHP
  • XML

У вас также по-прежнему есть возможность вручную ввести свои данные в wpDataTables или связать плагин с источником данных в реальном времени.

Эта функция очень полезна, потому что вы можете создавать таблицы, которые автоматически обновляются каждый раз, когда вы загружаете свою страницу. Вы также можете создать собственный запрос с помощью инструмента графического пользовательского интерфейса (GUI).

Как создать новую таблицу из данных

Вы можете создать новую таблицу, перейдя в wpDataTable и нажав Создать таблицу . Там вы увидите опцию Создать таблицу, связанную с существующим источником данных . Щелкните этот параметр, а затем нажмите кнопку Далее .

На следующем экране вы увидите различные варианты того, как вы хотите импортировать свои данные. Вам не нужно выбирать какой-либо из них, но некоторые из них могут оказаться удобными.

В разделе «Дисплей » вы можете выбрать параметр «Отзывчивое свертывание» , который очень полезен на устройствах с небольшими экранами. Вы можете редактировать полосы прокрутки, ограничивать ширину таблицы и так далее.

Вкладка «Редактирование» дает вам больше возможностей для внешнего редактирования. Это включает в себя печать, копирование и экспорт быстрых ссылок. Хорошо то, что вы можете просмотреть свои изменения в режиме реального времени . Каждый раз, когда вы вносите изменения, вам нужно нажать «Сохранить» или «Применить» .

Используете большие наборы данных? Без проблем. У нас есть серверная обработка

Если вы имеете дело с огромными наборами данных и создаете гигантские таблицы с множеством страниц, wpDataTables — это плагин WordPress, который вам нужен.

wpDataTables — это мощный и гибкий плагин, который может легко обрабатывать тонны данных. Серьезно, я говорю о тысячах или даже миллионах строк!

  • Устали ждать, пока загрузятся ваши массивные столы?
  • Устали от медленной сортировки и фильтрации?
  • Беспокоитесь о сбое ваших страниц из-за больших объемов данных?

Больше не надо! wpDataTables прикроет вашу спину. Он построен с фантастической функцией под названием «Обработка на стороне сервера». Этот плохой мальчик берет на себя всю тяжелую работу и делегирует ее серверу MySQL. Что это значит для вас? Это значит:

  • Более быстрая загрузка страниц
  • Умная фильтрация и сортировка
  • Больше никаких сбоев из-за больших наборов данных

Интересно, как это делается? Посмотрите это видео:

Теперь я знаю, о чем вы думаете: «Звучит слишком хорошо, чтобы быть правдой, не так ли?» Но позвольте мне сказать вам, это настолько реально, насколько это возможно.

Эта функция создана специально для таких людей, как вы, которые работают с большими наборами данных и хотят, чтобы работа с ними была бесперебойной.

Выбор правильной визуализации данных

После импорта данных вы можете начать думать о визуализации данных. Для этого откройте Мастер создания диаграмм . Вы найдете мастер после того, как откроете wpDataTables в разделе «Создать диаграмму» .

Во-первых, вы должны дать своей диаграмме имя, чтобы найти ее позже. Затем выберите один из четырех механизмов рендеринга диаграмм:

  1. Chart.js
  2. Google диаграммы
  3. Highcharts
  4. ApexCharts

Выбор правильной визуализации данных очень важен. Различные категории диаграмм больше подходят для разных типов данных.

Во-первых, подумайте о том, что вы хотите сделать с вашими данными. Это сообщение должно быть четким и заметным. Пять вопросов помогут вам определить, что вы хотите делать:

  • Если есть разные наборы данных, какова связь между ними?
  • Есть ли необходимость выделять распределение данных и выявлять выбросы?
  • Хотите сравнить значения? Если да, хотите ли вы сравнить разные точки данных или хотите проследить одну точку во времени?
  • Есть ли интересные тенденции в наборе данных?
  • Является ли этап визуализации данных частью анализа данных?

Когда вы знаете ответы на эти вопросы, вы готовы выбрать правильный тип диаграммы для своего проекта.

После редактирования графика или диаграммы вы можете перейти к следующему экрану и скопировать шорткод для визуализации данных.

Теперь вы готовы вставить шорткод в контент вашего сайта. Сохраните его и проверьте внешний вид, чтобы увидеть, как он выглядит.

Внутри wpDataTables есть особая опция. Это позволяет вам сохранить свои таблицы, даже если вы удалите плагин .

Если вы когда-нибудь решите удалить плагин, вы все равно найдете свои таблицы в базе данных.

Создайте диаграмму из таблицы

Давайте немного углубимся в создание визуализации данных с помощью wpDataTables. Плагин позволяет создавать впечатляющие интерактивные графики и диаграммы из любого источника данных. Вы можете использовать файлы Excel, CSV, MySQL, JSON и многое другое.

Когда ваша таблица будет готова к обработке, выберите «Диаграммы» и нажмите «Добавить новую» .

Дайте проекту название и выберите машину для рендеринга, как описано выше. Вы можете выбрать Google Charts, Chart.js или другие. Каждый движок рендеринга имеет свои характеристики, каждый со своими плюсами и минусами. Вы можете поиграть и посмотреть, какой из них лучше всего подходит для вашего проекта.

Кроме того, каждый механизм рендеринга предоставит вам различные категории диаграмм , такие как гистограммы, столбцы, области и линии. Вверху есть раскрывающееся меню, где вы можете выбрать тип визуализации данных, который вы хотите.

Форматирование и предварительный просмотр

Теперь плагин позволит вам отформатировать диаграмму или график так, как вы хотите. Вы можете сразу увидеть свои изменения на панели в правой части экрана.

Вы заметите, что существует несколько категорий форматирования для каждого элемента диаграммы или графика. Первый набор параметров позволяет настроить следующие параметры:

  • Цвета фона
  • Цвет границы
  • Радиус границы
  • Ширина рамки
  • Высота диаграммы
  • Ширина диаграммы
  • Групповая диаграмма
  • Отзывчивая ширина

Еще одна категория форматирования — «Серии» , где вы можете настроить серию данных. В разделе «Оси» вы найдете все параметры, связанные с расположением осей графика. Вы можете настроить оси X и Y независимо друг от друга.

Следующая категория — экспорт . Вы можете разрешить посетителям вашего сайта загружать ваши инструменты визуализации данных в различных форматах:

  • CSV
  • JPG
  • PDF
  • PNG
  • SVG
  • XLS

Категория панели инструментов доступна только для ApexCharts. Этот параметр позволяет пользователям загружать данные визуализации в форматах векторных изображений CSV, PNG и SVG.

Если вы довольны тем, как выглядит ваша диаграмма или график, вы можете сохранить их, нажав кнопку «Сохранить диаграмму» . wpDataTables сохранит его в базе данных WordPress. На этом этапе он также сгенерирует для вас шорткод.

Опубликуйте диаграмму на своем веб-сайте или в блоге

В более старых версиях используется классический редактор WordPress. Но вы также можете использовать его, если работаете с WordPress 5+. Для этого вам нужно скачать и установить плагин Classic Editor.

В классическом редакторе вы можете вставить шорткод, созданный wpDataTable для вашей диаграммы. Примером шорткода может быть:

 [ идентификатор wpdatatable = 22 ]

Чтобы правильно вставить код, выполните следующие действия:

  1. Перейти к сообщениям
  2. Нажмите «Добавить новую» или «Страницы» .
  3. Выберите Добавить новый
  4. Вставьте шорткод в содержимое в редакторе.
  5. Обновите или опубликуйте свою страницу или сообщение в блоге

Другой способ опубликовать таблицу — использовать кнопку wpDataTables в редакторе. Нажмите кнопку, чтобы выбрать диаграмму, которую вы хотите использовать, и нажмите «Вставить» .

Редактор Гутенберга — еще один инструмент для управления вашим контентом. На самом деле, это дает вам больше возможностей для вашей диаграммы. Вы можете выбрать, какую таблицу вы хотите и как ее отображать, и вы можете определить заполнители переменных и экспортировать имена файлов.

Существует интеграция для wpDataTables в Divi Page Builder. С помощью этого конструктора страниц вы можете вставлять диаграммы и таблицы прямо в пользовательский интерфейс Divi.

Заключительные слова о визуализации больших наборов данных с помощью wpDataTables

Извлечь нужную информацию из больших данных непросто, но с помощью правильных методов визуализации данных вы можете это сделать. В этой статье показано, как можно преобразовать необработанные данные в привлекательные графики и диаграммы. Это необходимый навык, если вам нужно визуализировать большие наборы данных.

Этот плагин очень гибкий. Так что попробуйте и посмотрите, как вы можете получить больше от сложных данных с помощью визуализации данных. Вы заметите, что изменение всего нескольких параметров может сделать вашу презентацию при визуализации больших наборов данных.

Если вам понравилась эта статья о визуализации больших наборов данных, прочтите и эти:

  • Не пропустите эти тенденции визуализации данных
  • Как использовать динамическую визуализацию данных для лучшего представления данных
  • Самая впечатляющая интерактивная визуализация данных, которую вы найдете в Интернете