Найти тему

Как создать интерактивную карту на Carto

Содержание

  1. Описание инструмента
  2. Интерфейс
  3. Загрузка данных
  4. Панель управления и визуализация
  5. Публикация карты

1. Описание инструмента

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

Данные загружаются с помощью облачных хранилищ (Box, Dropbox, Google Drive) и баз данных (Snowflake, Redshift, BigQuery, MySQL, PostgreSQL, SQL Server). Также можно загрузить данные в форматах CSV, XLS, ZIP, KML и другие.

-2
-3

2. Интерфейс

Заходим на сайт https://carto.com и нажимаем на «Try for free».

-4

Откроется страница создания аккаунта. Вводим свои данные (email, имя пользователя и пароль) и нажимаем «Next».

Carto предоставляет бесплатный аккаунт на 12 месяцев, но с ограниченным функционалом. Однако, бесплатной версии достаточно, чтобы освоить данный инструмент на профессиональном уровне.
-5

После прохождения регистрации заходим через Login и вводим свои логин и пароль.

-6

Открывается главная страница «Dashboard». В бесплатной версии нам доступны:

  • 3 публичных карт с возможностью шэринга.
  • 150 МБ хранилища данных.
  • 10 слотов датасетов.
-7

3. Загрузка данных

Для начала работы в Carto необходимо загрузить данные. Мы можем это сделать нажав на раздел «Data», затем «New Dataset».

-8

Откроется панель добавления данных Add datasets, где мы можем выбрать разные методы загрузки данных.

Самый простой и быстрый способ — это загрузить данные в формате XLS, CSV. Для этого мы выбираем раздел «Upload».

-9

В разделе «Upload» загружаем данные нажав на кнопку «Browse».

-10

Для отображения данных на карте необходимы координаты (Longitude, Latitude) объектов, которые мы хотим отобразить. Есть готовые библиотеки и API, которые могут преобразовать текстовый адрес в координаты. Для демонстрации подготовлены данные выгруженные из сайта https://data.egov.kz/ по преступности в городе Алматы.

Пример данных:

-11

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

-12

Загруженный файл отображается в Carto и в некоторых полях уже определены типы данных, такие как координаты и год (выделены зеленым цветом). Нажимаем на «Create map».

-13

Данные успешно загружены в Carto. Нажимаем на «Edit your map».

-14

4. Панель управления

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

Главная панель разделена на 2 части:

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

В панели управления есть 2 вкладки – Layers (слои) и Widgets. В бесплатной версии у нас есть возможность добавлять только 4 слоя. В разделе Widgets будут отображаться фильтры данных.

Заходим на наш первый слой «crime_map_ala», который мы загрузили. Появляются возможные варианты отображения данных в разделе «Style».

  1. Aggregation. Здесь мы можем выбрать варианты отображения данных в виде точек, квадратов, хэксбинов, регионов, анимационной и тепловой карты.
  2. Style. Здесь мы можем выбрать размер точек в зависимости от размера или фиксированным размером, выбрать цвет точек, ширину и цвет линий, а также выбрать разные варианты слияния точек, для лучшего визуального отображения данных на карте.
-16

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

-17

В разделе «Widgets» отображены наши выбранные фильтры из вкладки «Data». Здесь мы можем изменить вид отображения фильтра, изменить порядок с помощью перетаскивания разделов вверх или вниз. Справа на карте отображены фильтры и информация, с которой мы хотим работать. Нажав на фильтры данные соответственно меняются под выбранный нами параметр.

-18

Выбрав РУВД Алмалинского района, на карте отображаются только те преступления, которые были совершены в Алмалинском районе.

-19

В разделе «Analysis» можно создавать воспроизводимые рабочие процессы для анализа и объяснения данных. Нажимаем на «Add new analysis».

-20

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

-21

В разделе «Pop-up» можно добавить всплывающее окно и отобразить в нем данные. Например, район, улицу и код.

-22

В разделе «Legend» можно отобразить легенду точек и дать им название.

-23

5. Публикация карты

Чтобы опубликовать карту нужно нажать на кнопку «Publish».

Появится экран публикации. Есть 2 варианта публикации – ссылка и iframe. Проще всего сделать ссылку, которую можно сделать публичной или приватной. Нажимаем на кнопку «Publish»

-24

Нажимаем на кнопку «Private», выбираем «Public – with link»

-25

Появляется ссылка на карту, которую мы можем скопировать и поделиться.

-26

Ссылку вставляем в поисковую строку в браузере и откроется наша созданная карта.

-27

Наша карта на инструменте Carto создана! Демо карты

С помощью функции Embed it, можем внедрить код и через iframe и показать саму карту.