Обикновено карта на openlayers

Не много отдавна, се проведе конференция. посветена отворена географска информационна система (ГИС). Сега материалите от конференцията на разположение онлайн - аз съветват да изглежда, можете да се съберат много интересни неща. И тъй като темата е много ток (и да добавите материал на руски, което често не е достатъчен), реших да се започне внасянето на искане за gisam и да направи карта на OpenLayers.

Друга популярна библиотека с отворен код за работа с карти е листовки. Тя е по-лек в сравнение с OpenLayers и има набор от най-често срещаните функции, които да покриват нуждите на повечето потребители. И ако имате нужда от повече - със сигурност ще намерите липсващата функционалност в един от многото приставки. Защо моят избор падна на OpenLayers. Съвсем наскоро пусна нова версия (в действителност, библиотека напълно пренаписана сравнение с 2.x линия) и е интересно да се види какво ще зарадва разработчиците OpenLayers 3.

Продължете директно към картата. За да започнете, изтеглете OpenLayers. От сваления архив, ние се нуждаем ol.css стил и самата библиотека ol.js. Свържете ги към страницата:

Сега контейнера се намира на страницата, която ще се показват на картата:

Дотук всичко е просто и ясно (макар че ще продължи да бъде малко по-сложно). Сега да преминем към инициализиране на картата:

Параметърът определя какво ще бъде поставен DOM-елемент карта - това е преди да сте създали DIV елемент с номер, равен на картата. Сега, върху празна карта, за да добавите слой OpenStreetMap:

OpenLayers поддържа много формати, по-нататък се запознаят с тях по-близо. Докато достатъчно, за да знаем, че сме свързани с плочки слой, който служи като източник на предварително определен OpenStreetMap. За най-любопитните има документация.

център - е, разбира се, в центъра на картата (координати на които се качват в Москва) и мащабиране - е нивото на приближение. По-голямата стойност, толкова по-близо получаваме, и толкова по-детайлно на картата става. След инсталирането на центъра може да се види на картата в желаната форма:

Е, да започне. Други примери и техники ще станат все по-трудно, и ако не излиза извън рамките на "примитивни карти." Работната Пример поставен върху GitHub

А просто карта за OpenLayers