shoorick: (Рыжий)
Что-то стало модно всё подряд писать на яваскрипте. Куда ни глянь — всюду JavaScript, даже за пределами веба. Генератор карт TileMill — на яваскрипте. Текстовые редаторы и IDE теперь тоже на нём же пишут. Потому-то современные редакторы, наверное и тормозят — у них ведь помимо редактора ещё целый браузер внутри! У Komodo Edit и Komodo IDE — Mozilla Firefox, у Атома и Visual Studio Code — Chromium.

ls ~/bin/komodo/lib/mozilla

http://shoorick.ru/2016/09/02/js-everywhere/
shoorick: (Рыжий)
В прошлых сериях экспериментов с ТайлМиллом доводилось раскрашивать находящиеся в университетском городке здания и добавлять номера домов. Теперь попробуем раскрасить какую-нибудь территорию, да и здания можно перекрасить как-нибудь иначе. Заодно и повод подвернулся: авторы сайта mapstr.ru решили поменять самодельную карту Стерлитамака на OpenStreetMap — там город неплохо отрисован (хотя, конечно, есть ещё, что улучшать), им в целом нравится стиль, которым отрисована карта окрестностей нашего университета, но им хочется, чтоб было как в ДубльГИСе — чтоб стоянки, дворы и частный сектор были залиты разными цветами. Ну и школы с детсадами хочется выделить цветом.

Делаем так... )
Результат — на http://mapstr.ru/map/

Фрагмент карты Стерлитамака

http://shoorick.ru/2016/05/17/school-painging/
shoorick: (Рыжий)
Недавно появилась задача — перевести карту студенческого городка на английский. Или хотя бы транслитерировать её, избавившись от кириллицы. Карта состоит из двух групп слоёв, в одной из них содержатся слои с маркерами, задаными яваскриптовым кодом — перевести их не составит труда, а вот растровый слой, подложку, поверх которой отображаются маркеры, перевести чуть сложнее — об этом сегодняшняя история.
Тут написано, как именно сделать, а после — результат: )кириллицы там уже не будет.

Карта без кириллицы

http://shoorick.ru/2015/09/08/transliterated-map/
shoorick: (Рыжий)
Функция selectall_arrayref перлового модуля DBI хороша для тех, кому лень писать:
This utility method combines "prepare", "execute" and "fetchall_arrayref" into a single call. It returns a reference to an array containing a reference to an array (or hash, see below) for each row of data fetched.

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

Реальный пример: скрипт, извлекающий тайлы из пакета, созданного Тайлмиллом, пытался читать данные как раз функцией selectall_arrayref. Зная, что применяется запрос
SELECT * FROM tiles

и что представление tiles содержит, помимо прочего, содержимое тайлов, занимающее места больше всего остального, нетрудно догадаться, что попытка выполнения запроса потребует выделения памяти в объёме, сопоставимом с размером файла, в котором сидит база (пакет с тайлами — это база SQLite).

Набор тайлов для территории размером 600×400 км в средних широтах — например, с Челябинском по центру, Ашой на западе, Карталами на юге и Тюменью на северо-востоке — займёт больше гигабайта для набора масштабов не больше шестнадцатого. На практике так и получилось: скрипт отжирал больше гигабайта памяти и всё никак не мог приступить к полезной части, пытаясь отожрать ещё. Если же увеличивать масштаб, затраты вырастут ещё сильнее: добавим семнадцатый зум масштаб — понадобятся ещё три-четыре гигабайта, Добавим восемнадцатый, которого хватит даже для любопытных исследователей карт — ещё на десять-двадцать объём вырастет. Если будем сохранять тайлы с глубиной цвета 24 бита, а не восемь — ещё больше места израсходуем. Получается, что средних размеров российская область может занять своими тайлами десятки гигабайт. И скрипт бы безуспешно пытался эти десятки получить.

Переписал:
-my $tiles = $dbh->selectall_arrayref(
-    'SELECT * FROM tiles',
-    { Slice => {} },
-);
-
-foreach my $tile ( @$tiles ) {

+my $sth = $dbh->prepare('SELECT * FROM tiles');
+   $sth->execute;
+
+while ( my $tile = $sth->fetchrow_hashref ) {

и всё наладилось: скрипт перестал жрать память (ему хватило десяти мегабайт) и ждать её выделения — сразу работает.

Вывод: не всегда надо экономить рабочее время программиста — иногда надо и о машинном времени задумываться.

http://shoorick.ru/2015/08/26/more-code/
shoorick: (Рыжий)
На сайте Ильменского фестиваля теперь используется правильная карта — её можно двигать и масштабировать, включать отображение нужных маркеров и кликать по ним, чтоб получить подсказку.

Карта

Карта — OpenStreetMap, стиль отображения — свой собственный на основе OSM Bright, отрисованный с помощью TileMill, иконки — The Map Icons Collection. Библиотека для отображения — Leaflet c плагинами Leaflet-hash и Leaflet.fullscreen.

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

http://shoorick.ru/2015/07/04/interactive-map/
shoorick: (Рыжий)
В марте я рисовал для википедии челябинскую трамвайную схему при помощи TileMill, однако как выделить трамвайные пути самим тайлмиллом, я не знал. Пришлось тогда экспортировать схему в SVG и затем редактировать полученный SVG-файл в Inkscape, вручную выделяя нужные рельсы и меняя им внешний вид.

На самом деле в том, чтоб TileMill нарисовал трамвайные пути, нет особо хитрой магии. И сейчас расскажу, как нарисовать их, не беря в руки красный маркер )
Результат:

Схема трамвайных путей

Для того, чтоб убедиться в работоспособности метода, этого вполне достаточно.

Бросается в глаза отсутствие подсветки на мостах — связано это с тем, что слой #bridge находится выше, чем #roads_high. Возможный способ решения — завести свой слой железных дорог (а для этого надо уже́ лезть в imposm-mapping.py, но теперь это не страшно), поместить его выше слоя с мостами и написать для железнодорожного слоя свои стилевые правила.
http://shoorick.ru/2014/10/07/tram-sshema-tilemill/
shoorick: (Рыжий)
Итак, после предыдущих упражнений здания на нашей карте обзавелись номерами и высотой. Что дальше? Дальше можно, например, раскрасить здания в разные цвета. Можно раскрасить дома в зависимости от основного их предназначения (то есть, в зависимости от содержимого тэгов amenity и building). Можно — в зависимости от принадлежности здания.

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

Сделаем то же самое на карте OpenStreetMap )
Результат:
Карта с разноцветными домами
http://shoorick.ru/2014/10/06/building-color/
shoorick: (Рыжий)
Продолжаем эксперименты с обработкой карт напильником. В прошлый раз удалось добавить на карту номера домов — сегодня попытаемся сделать дома чуть выше.

С одной стороны в CartoCSS есть свойство building-height, описывающее «высоту» зданий — это видно на крупных масштабах (от 17). В OSM Bright величина building-height постоянна, что даёт на карте здания одинаковой высоты.

Карта

Но нас это не устраивает — мы сделаем по-другому )

Результат:

Карта OSM со зданиями разной высоты

В следующий раз мы рассмотрим способ раскраски зданий в разные цвета.
http://shoorick.ru/2014/10/04/more-levels/
shoorick: (Рыжий)
На карте, отрисовываемой из OpenStreetMap стилем, основанным на OSM Bright, нет номеров домов. Попытки на скорю руку сочинить какой-нибудь стиль, заглядывая в нагугленное, не увенчались успехом — пришлось разобраться подробнее. Выяснилось следующее: одним редактированием стилевого файла не обойтись, надо ещё и внести данные в базу.

И как же это сделать )
Результат — susu.ac.ru/ru/about/campus

Картографические данные © Участники OpenStreetMap http://osm.org/
http://shoorick.ru/2014/09/05/how-to-add-house-numbers/
shoorick: (Рыжий)
Когда-то для статьи «Челябинский трамвай» в википедии я нарисовал поверх какой-то карты схему маршутов, простенькую, куда проще бирмановской. Нарисовал, выложил нарисованное (без карты, только схему) в векторном виде, да и забыл — пить-есть не просит.

Прошло шесть с половиной лет, OpenStreetMap развился до состояния, когда на карты некоторых районов уже можно стало смотреть без слёз. «Почему б не попробовать схему с картой из OSM?» — подумал я. И попробовал.

Сначала был TileMill (я год назад о нём рассказывал на UWDC) — можно, например, сделать свой картостиль, основываясь на OSM Bright. Карта получается достаточно симпатичной и её внешний легко настраивается — в тайлмилле используется CSS-подобный язык разметки. Однако добавить на карту трамвайные маршруты не получилось — в OSM Bright трамвайные пути и железные дороги отображаются совершенно одинаково. Это, наверное, можно изменить, поковырявшись в настройке, но скрипты преобразования геоданных написаны на питоне, в котором я почти ничего не понимаю. Поэтому пришлось добавлять трамвайные линии вручную. Результат —

Трамвайные маршруты Челябинска

Попробовал альтернативный способ — alaCarte. В alaCarte оказалось возможным сразу выделить трамвайные пути, и, кроме того, alaCarte создаёт набор тайлов, без лишней обработки пригодный для использования с библиотеками OpenLayers и Leaflet.
Схема трамвайных маршрутов

в виде интерактивной карты — http://tile.susu.ac.ru/tram.html, используемые стили скоро будут на гитхабе. Stay tuned!

Profile

shoorick: (Default)
shoorick

December 2016

S M T W T F S
    1 23
45678910
11121314151617
18 19 2021222324
25262728293031

Syndicate

RSS Atom

Most Popular Tags

Style Credit

Expand Cut Tags

No cut tags
Page generated Jan. 23rd, 2026 07:57 am
Powered by Dreamwidth Studios