Начало работы с TileMill: различия между версиями

Материал из GIS-Lab
Перейти к навигации Перейти к поиску
Строка 94: Строка 94:


===Работа с цветом===
===Работа с цветом===
Существует два способа изменить цвет в той или иной настройке. Первый, напрямую ввести шестнадцатиричный код цвета в настройку.
Существует два способа изменить цвет в той или иной настройке. Первый, напрямую ввести шестнадцатиричный код цвета в настройку. TileMill поддерживает несколько способов ввода значения цвета.


<>
<syntaxhighlight lang="css">
line-color: #ff0;
line-color: #ff0;
line-color: #ffff00;
line-color: #ffff00;
Строка 102: Строка 102:
line-color: rgba(255, 255, 0, 1);
line-color: rgba(255, 255, 0, 1);
line-color: hsl(100, 50%, 50%);
line-color: hsl(100, 50%, 50%);
line-color: yellow;
line-color: yellow;</syntaxhighlight>


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

Версия от 20:36, 19 августа 2012

Эта страница является черновиком статьи.


Быстрое введение в TileMill

TileMill - еще одно свободное средство для создания карт с некоторыми особенностями.

Это описание - переведенное и адаптированное пособие по началу работы с TileMill с официального сайта разработчиков программы, компании Mapbox.

В этой статье мы разберем следующие шаги:

Установка TileMill

Установщик TileMill существует для ОС Windows (XP, 7, 8), OSX и Ubuntu.

Для работы с программой необходимо подключение к интернет.

В этой статье приводится пример работы с TileMill версии 0.9.1 в ОС Windows 7. Скачать установочную версию программы для этой ОС можно по ссылке.

Создание проекта

Как и в других TileMill оперирует проектами, главное окно программы представляет собой менеджер проектов. Проекты отсортированы по названию. Создадим новый проект.

Окно начала работы

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

Создание нового проекта

В результате этой операции будет создан новый проект, имеющий базовую подложку из границ стран, суши и моря (слой countries), центрированную на координатах 0,0. Вся дальнейшая работа над картой проходит в окне проекта.

Вид созданного проекта по умолчанию

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

TileMill поддерживает импорт следующих форматов данных:

  • CSV
  • ESRI Shape
  • GeoJSON
  • GeoTIFF
  • SQLite
  • PostGIS

Чтобы добавить слой, в окне проекта, нажмите на кнопку управления слоями и нажмите на Add layer,

Добавление слоя

Добавим слой границ областей из Geosample. После того как данные скачаны и распакованы, в диалоге добавления слоя нужно просто найти слой в дереве каталогов и нажать "done".

Добавление слоя

Введем имя слоя, так, как оно будет отображаться в дереве слоев: "admin".

Нажмем Save & Style. Слой будет добавлен на карту с условными обозначениями по умолчанию. Если нажать просто Save, то слой будет добавлен, но условные обозначения прописаны не будут и соответственно виден на карте он не будет пока они не будут заданы.

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

Результат добавления слоя

Настройка условных обозначений

В отличие от "классического" ПО ГИС, TileMill не имеет развитых визуальных средств создания и настройки условных обозначений. Вся эта функциональность возложена на CartoCSS - специальный CSS-подобный язык описания условных обозначений.

Если при добавлении слоя вы нажали Save & Style, то для слоя admin должно появиться следующее описание:

#admin {
  line-color:#594;
  line-width:0.5;
  polygon-opacity:1;
  polygon-fill:#ae8;
}

Разберем эту запись.

Сначала указывается название слоя с решеткой и контейнер в фигурных скобках, в котором указываются остальные настройки #admin {}. Каждая настройка представляет собой пару название:значение. Описание конкретной настройки завершается точкой с запятой.

По строкам:

line-color:#594;

Цвет линии.

line-width:0.5;

Толщина линии.

polygon-opacity:1

Непрозрачность.

polygon-fill:#ae8;

Цвет заливки полигонов.

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

line-dasharray:5,5;

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


Помощь с CartoCSS

Главным ресурсом объясняющим как создать то или иное условное обозначение с помощью CartoCSS является справочник по языку. Он также интегрирован в TileMill, чтобы его вызвать, нужно нажать на {}.

Встроенный справочник по CartoCSS

Работа с цветом

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

line-color: #ff0;
line-color: #ffff00;
line-color: rgb(255, 255, 0);
line-color: rgba(255, 255, 0, 1);
line-color: hsl(100, 50%, 50%);
line-color: yellow;

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

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


Выбор цвета с помощью панели цветов и селектора

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

Работа с атрибутивной информацией

TileMill некорректно отображает атрибутивную информацию в кодировке CP1251.