Я искал надежное решение, которое позволило бы мне создать веб-карту и наложить векторные многоугольники, не затрачивая на это вечную загрузку таких данных, чтобы позволить каждому полигону отображать свой цвет при событии наведения мыши.
Насколько мне известно, есть 3 варианта для достижения этой цели с помощью Canvas, SVG, Flash.
Похоже, что Flash будет лучшим решением, если он будет работать на Apple iPhone / iPad, так как он обеспечивает самый быстрый рендеринг и самый чистый дисплей. Canvas, кажется, второй лучший выбор, но он занимает ОЧЕНЬ много времени, если на карте отображаются сотни полигонов, тогда как SVG визуализируется еще дольше.
Я почти потерял надежду в поиске решения этой проблемы, но сегодня я наткнулся на компанию GISCloud http://www.giscloud.com (в настоящее время в бета-версии с бесплатной регистрацией).
Этой компании SOMEHOW удалось найти удивительный способ визуализации сотен векторов на карте в режиме реального времени. Я был поражен их подходом, и мой вопрос к сообществу касается того, как мы можем воспроизвести их подход для использования с существующими технологиями, такими как листовка, открытые слои, воск ...
Посмотрите сами на это удивительное демо: http://www.giscloud.com/map/284/africa
Убедитесь, что вы наводите курсор на любой из многоугольников на странице, и проверьте элементы управления масштабированием, чтобы убедиться, что эти многоугольники действительно являются векторами.
Что я заметил, глядя на запросы с firebug, так это то, что карта запрашивает определенные файлы json. Кажется, что в зависимости от уровня / области масштабирования запрашиваются несколько файлов json.
Я должен также упомянуть, что когда giscloud загружает данные на странице, нависающей над вектором, немедленно меняет цвет, не создавая новый запрос.
ПРИМЕРЫ:
- http://cft1.giscloud.com/t/1316509973/map284/layer1156/3/3/3.json
- http://cft1.giscloud.com/t/1316509973/map284/layer1156/3/5/3.json
- http://cft1.giscloud.com/t/1316509973/map284/layer1156/3/4/4.json
- http://cft1.giscloud.com/t/1316509973/map284/layer1156/3/3/4.json
- http://cft1.giscloud.com/t/1316509973/map284/layer1156/3/5/4.json
Я предполагаю, что структура URL соответствует стандартной логике службы листов (например, папка с 3-й по последнюю очередь является уровнем масштабирования ...).
В любом случае я проанализировал фактические данные этих файлов json, и кажется, что логика, которую они используют, следует некоторой логике, с помощью которой они создают свои векторы, основываясь только на этих значениях данных:
- ширина / высота: они определяют ширину и высоту данных, обслуживаемых в каждом запросе json
- пиксели: здесь они определяют значения пикселей, которые, как я предполагаю, как-то связаны с некоторыми общими координатами пикселей x / y для обобщенных уровней точек? Я предполагаю, что у них есть способ автоматически упростить регион в зависимости от уровня масштабирования. Я предполагаю, что они используют координаты пикселей. Я предполагаю, что они значительно уменьшают размер данных, которые должны быть загружены, по сравнению с данными широты / долготы.
- стили: здесь они определяют два значения RGB CSS. «F» представляет цвет файла полигона и «S» представляет цвет границы полигона.
- geom: здесь я предполагаю, что они каким-то образом определяют конкретное определение каждого полигона в загружаемом тайле, где такие данные определяются на основе окна контейнера карты. Также интересно то, что каждая запись имеет значение «S», которое, как я полагаю, используется в качестве необязательного значения атрибута или ссылки на функцию, и в конце каждой записи здесь есть область, которая, кажется, определяет конкретный идентификатор для каждого вектора вместе с идентификатор слоя, который, как я догадываюсь, используется для того, чтобы каким-то образом объединить данные из каждого вызываемого запроса мозаики json.
Я также предполагаю, что они каким-то образом нашли способ автоматического определения и разделения данных, которые должны быть загружены для каждой плитки, в зависимости от размера данных, которые должны быть загружены для запрошенной плитки.
Вот извлеченная разбивка одного из этих запросов:
{"width":256,"height":256,"tile":
{"pixels":
[0,6461,-1,0,5,148,0,509,-1,10715,-1,1,-1,251,-1,1,-1,1,-1,251,-2,3,-1,255,-1,249,-2,5,-2,247,-1,509,-3,251,-1,2,-2,253,-2,252,-2,254,-1,255,-1,254,-1,255,-1,1276,-2,13,-1,233,-1,2,-1,253,-1,1,-1,255,-1,247,-1,1306,-1,1533,-1,1269,-1,1276,-1,2303,-1]},
"styles":
[{"f":"rgb(99,230,101)","s":"rgb(5,148,0)","lw":"0"}],
"geom":
[
{"s":0,"p":[4,143,5,144,3,146,1,146,2,143,4,143],"c":"layer1156_5098"},
{"s":0,"p":[-2,143,0,140,2,141,2,144,1,146,-2,144,-2,143],"c":"layer1156_5067"},
{"s":0,"p":[7,143,5,144,4,143,2,143,2,141,5,138,6,139,5,141,7,143],"c":"layer1156_5051"},
{"s":0,"p":[10,141,11,137,12,137,14,137,12,142,9,143,9,142,10,141],"c":"layer1156_5041"},
{"s":0,"p":[1,136,0,140,-2,143,-2,136,1,136],"c":"layer1156_5038"},
{"s":0,"p":[8,143,5,141,5,137,8,136,10,137,10,141,8,143],"c":"layer1156_5033"},
{"s":0,"p":[5,137,2,141,0,140,1,136,1,136,2,135,3,136,5,137],"c":"layer1156_5028"},
{"s":0,"p":[10,134,12,136,11,138,8,135,10,134],"c":"layer1156_5020"},
{"s":0,"p":[-2,133,0,136,-2,136,-2,133],"c":"layer1156_5005"},
{...}
...
]
}
Как мы можем воспроизвести такой же (или похожий) тип скорости, используя postgis (который, как мне кажется, они также используют)?