OpenLayers: подложка MapBox
Добавлено: 15 дек 2010, 21:00
Готовые тайл-сеты от MapBox. Только часть из них покрывает весь мир (ищите с префиксом 'world'). Остальные рекомендую хотя бы посмотреть, у них очень красивый и оригинальный дизайн.
Terms of Service. Сами тайлы абсолютно свободные, можно скачивать, распространять и т.п. Если пользуетесь тайлами с сервера MapBox, то есть ограничения по трафику.
Выбираете понравившийся тайл-сет и открываете его (например). В правой части приводится блок с технической информацией и готовый код для вставки в html-страницу (Embed code for OpenLayers).
В сущности все заключается в загрузке доп. скрипта (определяет класс OpenLayers.Layer.MapBox):
И последующем подключении слоя:
Массивы разрешений (resolutions) смотрите во все том же "Embed code for OpenLayers".
Формат (type) всегда 'png'. Имя слоя (layername) смотрите в технической документации.
Примечание: конкретно для слоя 'world-glass' нужно задать для div'а карты темный фон иначе ничего не увидете (все объекты белого цвета с разной прозрачностью):
При подключении слоя MapBox на карте отображается логотип и ссылка на "Term of Service". Странно, но если при создании карты заполнить массив контроллеров:
то логотип не показывается. В чем причина я особенно не разбирался. Обходится поздним добавлением контроллеров:
Если задать 'osm: true', то добавится указание лицензии OpenStreetMap - CCBYSA. Нужно его включать или нет смотрите для каждого тайл-сета отдельно в графе Sources.
P.S. Есть также инструкция по подключению слоев MapBox без использования доп. библиотеки. По сути это самые обычные TMS и OpenLayers умеет работать с ними напрямую.
Terms of Service. Сами тайлы абсолютно свободные, можно скачивать, распространять и т.п. Если пользуетесь тайлами с сервера MapBox, то есть ограничения по трафику.
Выбираете понравившийся тайл-сет и открываете его (например). В правой части приводится блок с технической информацией и готовый код для вставки в html-страницу (Embed code for OpenLayers).
В сущности все заключается в загрузке доп. скрипта (определяет класс OpenLayers.Layer.MapBox):
Код: Выделить всё
<script src="http://js.mapbox.com/ol/2.8/mapbox.js"></script>
Код: Выделить всё
var topo = new OpenLayers.Layer.MapBox("MapBox", {
layername: 'world-glass',
osm: true,
type: 'png',
serverResolutions: [
156543.0339,78271.51695,39135.758475,19567.8792375,
9783.93961875,4891.96980938,2445.98490469,1222.99245234,
611.496226172,305.748113086,152.874056543,76.4370282715,
38.2185141357,19.1092570679,9.55462853394,4.77731426697,
2.38865713348,1.19432856674,0.597164283371
],
resolutions: [
156543.0339,78271.51695,39135.758475,19567.8792375,
9783.93961875,4891.96980938,2445.98490469,1222.99245234,
611.496226172,305.748113086
]
});Массивы разрешений (resolutions) смотрите во все том же "Embed code for OpenLayers".
Формат (type) всегда 'png'. Имя слоя (layername) смотрите в технической документации.
Примечание: конкретно для слоя 'world-glass' нужно задать для div'а карты темный фон иначе ничего не увидете (все объекты белого цвета с разной прозрачностью):
Код: Выделить всё
<div style="width: 512px; height: 341px; background: #441344" id="map"></div>При подключении слоя MapBox на карте отображается логотип и ссылка на "Term of Service". Странно, но если при создании карты заполнить массив контроллеров:
Код: Выделить всё
map = new OpenLayers.Map('map', {
projection: new OpenLayers.Projection('EPSG:900913'),
...
controls: [
new OpenLayers.Control.PanZoomBar(),
new OpenLayers.Control.Navigation,
...
]
});Код: Выделить всё
map.addControls([
new OpenLayers.Control.PanZoomBar(),
new OpenLayers.Control.Navigation,
...
]);Если задать 'osm: true', то добавится указание лицензии OpenStreetMap - CCBYSA. Нужно его включать или нет смотрите для каждого тайл-сета отдельно в графе Sources.
P.S. Есть также инструкция по подключению слоев MapBox без использования доп. библиотеки. По сути это самые обычные TMS и OpenLayers умеет работать с ними напрямую.
