Растровое волшебство

Что такое карты в интернете? Тайлы-картинки, либо медленная векторная отрисовка. На этом уровне застряли мы, стоит и Яндекс. Гугль, тем временем, позволяет через свой API творить настоящие чудеса:



Но... как?!
Поделиться
Отправить

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

← Ctrl →
24 комментария
Готэсса 2012
Сервер рендерит тайлы на ходу и выдает. По крайней мере на той странице.
Поди еще тайлы заранее нарендерены, просто перекрашиваются. Возможно есть несколько чернобелых растровых слоев.

Еще и дорого наверно использование этого API.
Фигня какая-то. Но у гугла были и векторные тайлы вроде.
Михаил 2012
Есть небольшое предположение на вопрос «Как?». Тайлы гугла представлены индексированным изображением. Каждому индексу соответствует определенная группа объектов на карте. Если пользователь имеет возможность заменять палитру изображения, то он может менять цвет объектов. Такой подход также объясняет, почему цвет менять можно, а прозрачность и тольщину объектов -нет(судя по видео этого делать нельзя).
Я вообще профан в графике — это просто моя профанская гипотеза. Но подобный метод мне достаточно интересен. Кто-нибудь знает точно, осуществим ли он?
jekader 2012
Видимо, у них всё прорендерено по слоям в промежуточный формат. Пользователь может менять только hue/saturation/lightness у готовой картинки.
Михаил 2012
Если бы тайлы рендерись по запросу — потребовалось бы очень много ресурсов. Такой подход осуществим, но только при небольшом числе пользователей. Как говориться любой каприз за ваши деньги. Но в таком случае можно было не мелочиться и дать возможность менять и толщину объектов.

Насчет включения/выключения подписей  — подписи представлены отдельным тайлсетом. Это необходимо для поддержки топонимов языка пользователя.
В принципе, мне кажется, что слой подписей не лежит на сервере, а генерируется по запросу- генерировать его быстро, а тайлы для всех языков держать на сервере — накладно.
LinFor 2012
Однако. Вероятней всего сервер на лету подменяет палитру, т. к. такими «раскрашенными» тайлы приходят уже с сервера.
http://mt0.googleapis.com/vt?lyrs=m@169183024&…;y=1373&z=12&apistyle=p.s%3A-80%2Cs.t%3A40|p.h%3A%23ff0023|p.s%3A40&s=Galileo&style=api|smartmaps
Владимир 2012
Блин, все забыли что-ли, что google отрисовывает карты через webGL?
Илья Зверев 2012
У меня не работает webGL, а тайлы перекрашиваются.
Готэсса 2012
> Блин, все забыли что-ли, что google отрисовывает карты через webGL?
А в ихнем WebGL разве не готовые тайлы используются?
Михаил 2012
И все-таки насчет палитр. Попробовал переназначить палитру для osm-тайлов.
(«http://narod.ru/disk/37274897001/0.png.html»)
(«http://narod.ru/disk/37275857001/76203.png.html»)

Основная проблема в этом методе — нужно рендить таким стилем, при котором каждому типу объекта соответствовали уникальные индексы.
Готэсса 2012
> Попробовал переназначить палитру для osm-тайлов
Ну там явно что-то похитрее чем 256-цветная картинка с палитрой.
Возможно много черно-белых слоев.
Михаил 2012
Я тоже предполагаю, что применяются слои.Вопрос: сколько их и сколько места они занимают. Черно-белые наверное не применяются, так как многие объекты красятся несолькими цветами.

А почему бы и не 256-цветов? Может хватить для нормальной карты. Надо только вынести отдельно слои poi и подписей.
Готэсса 2012
> А почему бы и не 256-цветов? Может хватить для нормальной карты.

Для антиалиазинга не хватит.
Михаил 2012
Да вообще, для каждого более-менее однородного слоя свой тайлсет — это шикарно. Но вот память не бесконечна.
Кстати,только что подумал,что если гугль все-таки применяет для этого дела слои — в скором времени они должны внедрить функцию включения/выключения определенных тематических слоев. Эта функция весьма полезна, а если карта уже разбита на множество тематических тайлов — то реализовать это совсем не сложно.
Михаил 2012
Сглаживание, это конечно, проблема.
Но и порождать множество послойных тайлов для osm нереально.

Вообще если нацелиться на возможность перекрашивать не все объекты, а только основные (вода, здания, подстилка), то может хватить 256. Хотя тут нужно очень хитро составить стиль.

р.s. поправка к моему предыдущему сообщению: слой poi и подписей ничто не мешать сделать единым.
Готэсса 2012
> Но и порождать множество послойных тайлов для osm нереально.

Зачем это хипстерство в OSM? Толку от возможности поменять только цвета по-моему никакого. Или уж мощная кастомизация, или не нужно это всё.
Wowik 2012
Типичная смена палитры в индексовой картинке на клиенте.
В Виндовс при загрузке так полосочка бегала.
Михаил 2012
смена цвета — не хипстерство, а вполне нужная функция. Допустим, информационное назначение твоей карты предполагет выделение одних(более важных) объектов и затенение других. Простой пример: карта зеленных насаждений: на ней необходимо ярко выделить непосредственно зеленные насаждения и убрать ненужную информацию (функционнальное назначение зданий). Конечно, эту задачу можно решить создав свой тайл-сервер. Но если есть простая возможность сделать это на основном сервере, то на неё нужно обратить внимание.
А есть ли такая возможность?
Antares19 2012
Еще одна причина перекрашивания карты — для встраивания в дизайн сайта. Для некоторых вебсайтов это можно быть важным требованием.
AkMeR 2012
Cloudmade
Илья Зверев 2012
Ну там просто создаётся ещё один стиль для мапника, тайлы в котором потом не очень часто перерендериваются. Ни о каком реальном времени речи нет (хотя я не пользовался их редактором — возможно, при редактировании стиля несколько тайлов делаются сразу).
AkMeR 2012
2 Zverik.
Там не просто мапник.
А попробовать редактор стилей однозначно стОит.
Михаил 2012
На osm poi и подписи представлены отдельным слоем?

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

Через мапник-питон так создаются подобные тайлы:

import mapnik

mapfile=’./style.xml’#стиль для мапника*
tile=’./tile.png’#куда записываем
m=mapnik.Map(256,256)
mapnik.load_map(m, mapfile)
e=Envelope(x1,y1,x2,y2)#координаты тайла
m.zoom_to_envelope(e)
mapnik.render_to_file(m,’tile.png’,’png256’)

*в xml-стиле нет специального синтаксиса для серых оттенков, в <Map> вроде бы нужно указать buffer-size=«256».

Вроде бы так. Можно собрать тайлсет для небольшого кусочка мира. Ресурс mapbox.com предаставляет бесплатно 5гб на 5 дней для тайлов. Можно поэкспериментировать...

Не знаете, есть готовые серые xml-стили?
Виктор 2012
Абсолютно согласен, что тайлы не рендерятся. Иначе бы тогда можно было убирать объекты, менять толщину и т. п.

Скорее всего используется картинка, в которой задизайнена определенная палитра. А потом с этой палитрой производятся преобразования, один цвет растекается (blur), второй обводится (хотя обводки тоже заранее можно подготовить). Судя по количеству объектов 256 цветов в палитре хватит.
Михаил 2012
Может соберем тестовый набор тайлов, который можно перекрашивать?
Можно отрисовать тайлы для маленького региона.

Я могу отрисовать тайлы в мапнике, кинуть на сервер и сделать небольшую тестовую программку(web-приложение не могу, слабоват я в вебе). Есдинственная проблема с xml-стилем — делается долго и опыта у меня мало.

Если кто-нибудь может помочь с xml-стилем, пишите — shishkin-michail@yandex.ru
Emsch 2012
Выдалась свободная десятиминутка и я посчитал количество используемых цветов, согласно следующей mapnik-схеме (http://trac.openstreetmap.org/browser/applications/rendering/mapnik/osm.xml).
Результаты следующие:

Цвет линий (тег stroke в LineSymbolizer):
Всего 521 варианта:уникальных — 62

Цвет полигонов(тег fill в PolygonSymbolizer):
Всего 11 вариантов:уникальных — 8

Цвет текста(теги fill и halo-fill в TextSymbolizer):
Всего 84 вариантов надписей: уникальных — 18

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

Отсюда вывод:
Чтобы сделать перекрашеваемую карту, нужно:
1.Вывести подписи, щиты, иконки в отдельный слой
2.Уменьшить количество уникальных линий(521 цвет на линии я думаю легко можно сократить)
3. Сопоставить каждой группе объектов множество уникальных цветов(256 цветов на всю карту должно хватить).
4.На сервере хранить несглаженные тайлы.

P.S. Очень сомневаюсь насчет количества цветов для полигонов — схема какая-то паленая попалась. Но по-крайней мере порядок чисел похож на действительность.
Emsch 2012
Опередили...
Только я решил собрать тестовую перекрашиваемую карту, как наткнулся на ресурс
http://www.itoworld.com/product/data/ito_map/main
Оказывается это ресурс был запущен в апреле 2010 года.
Хотя это не совсем то о чем здесь говорилось, но это почти то.
Популярное