Диаграммы в интерфейсах

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

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

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

  • распределение
  • сравнение
  • структуру
  • динамику
  • сравнение и структуру
  • динамику и сравнение
  • и т.д.

Например, если вы хотите визуализировать массив данных, используйте гистограмму.
Если вам нужно отобразить тенденции или динамику роста, лучше использовать линейный график.📈 А для сравнения двух и более значений используют столбчатые диаграммы.📊

Ниже приведу примеры наиболее распространенных диаграмм и графиков.

Распределение

Диаграммы в интерфейсах

Гистограмма (или распределенная диаграмма)

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

Аналог Гистограммы для демонстрации сравнения — График плотности

Коробчатый график (или диаграмма размаха) показывает распределение числовых переменных.

Например, если провести опрос между 2 группами (м/ж) и попросить ответить на вопрос c какой вероятностью по шкале от 1 до 10 они готовы купить N товар, то график покажет как распределились ответы.

Распределение и сравнение

Пузырьковая диаграмма показывает еще и дополнительные переменные в виде размера пузырька и его цвета. Например, можно показать взаимосвязь между средним достатком и продолжительностью жизни в разных странах. Размер пузыря покажет количество населения, а цвет — страну.

Пример в интерфейсе

Интерфейс CRM для соц. опросов
Интерфейс CRM для соц. опросов

Сравнение

Диаграммы в интерфейсах

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

Пример в интерфейсе

Интерфейс CRM
Интерфейс CRM

Радиальная диаграмма

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

Радиальные диаграммы можно разделить на два вида: замкнутые и спиральные.

Радиальная полосчатая диаграмма лучше не использовать, трудна для восприятия

Радиальная столбчатая диаграмма, если возможно лучше заменить столбчатую или радиальную.

Гистограмма см выше

Структура

Диаграммы в интерфейсах

Круговая - показывает части целого, то есть структуру

Аналог кольцевая диаграмма.

Примеры в интерфейсе

cue-to.ru
cue-to.ru
Интерфейс CRM
Интерфейс CRM

Структура и сравнение

Накопительная линейчатая диаграмма

Примеры в интерфейсе

Проект Dietchat
Проект Dietchat
Проект "Спецмаш"
Проект "Спецмаш"

Динамика

Диаграммы в интерфейсах

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

Динамика и сравнение

Площадная. Показывает динамику и тренды значений. Заливка показывает количественные различия, то есть сравнения.

Примеры в интерфейсе

Интерфейс CRM
Интерфейс CRM
Приложение "Медицинские анализы"
Приложение "Медицинские анализы"

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

В следующем посте напишу о видах графиков, которые показывают иерархию и взаимосвязи.

44
Начать дискуссию