WikiLeaflet

Материал из свободной русской энциклопедии «Традиция»
Перейти к навигации Перейти к поиску
WikiLeaflet
Реализует:
Географическая карта
Язык программирования:
JavaScript, CSS, викитекст (механизм шаблонов)



Системные требования:
LeafLet 0.7.3, jQuery 1.8
Разработчик:
Mithgol the Webmaster, Александр Машин



Дата появления:
30 июня 2011
Текущая версия:
0.7
Дата выхода текущей версии:
12 января 2015
Статус:
бета-версия


Предыдущая версия:
WikiLeafLet 0.6
Лицензия:
GPL 2.0

WikiLeaflet — средство размещения карт OpenStreetMap (а также некоторых других свободных карт сходного происхождения) в вики MediaWiki, придуманное Мицголом и развитое Александром Машиным.

Требования[править | править код]

Для своей работы WikiLeaflet требует наличия jQuery для MediaWiki версии 1.8 и библиотеки Leaflet версии 0.7.3.

WikiLeaflet состоит из нескольких частей, написанных на CSS, JavaScript и механизме шаблонов MediaWiki.

Лицензирование[править | править код]

Так как все эти части (в силу природы вики) свободно видимы на сайте, то Mithgol the Webmaster принял решение распространять WikiLeaflet по свободной лицензии GNU GPL версии 2.

Это решение, разумеется, никак не касается библиотеки Leaflet, которая не является частью WikiLeaflet и которая должна быть поэтому отдельно раздобыта и установлена (прежде WikiLeaflet) на условиях её собственной лицензии.

Порядок установки WikiLeaflet в MediaWiki[править | править код]

Установка Leaflet[править | править код]

Перед установкою WikiLeaflet сперва следует поместить библиотеку Leaflet в отдельный каталог на сервере вики (с именем наподобие «/leaflet/» или «/js/leaflet/» в зависимости от расположения движка вики), распаковав туда содержимое папки «dist» из дистрибутива Leaflet.

(Годится только версия Leaflet не ниже 0.7.3, в которой ошибка 136 ужé исправлена.)

В том же каталоге следует поместить прозрачный GIF под именем «trans.gif» (например, вот этот).

Установка основного скрипта WikiLeaflet[править | править код]

После того, как Leaflet установлен, следует создать системную страницу MediaWiki:WikiLeaflet.js, поместив туда основной скрипт WikiLeaflet. (Его можно скопировать из одноимённой страницы Традиции.)

Внесение изменений в Common.css[править | править код]

На страницу MediaWiki:Common.css следует добавить простую пару стилей, первый из которых скрывает нутро карты (создаваемое шаблонами WikiLeaflet), а второй задаёт вид текстовых пометок на карте:

/* Карта [[WikiLeaflet]] */
.wldata, .wikileaf .wldata * { display: none; }
.leafletLabel {
   font-size: 10px;
   line-height: 1;
   font-family: "PT Sans Caption", "Helvetica Neue", Arial, Helvetica, sans-serif;
   position: absolute;
   text-align: left;
   color: #000000;
   text-shadow:
      2px 2px 1px #ffffff,
      2px 0 1px #ffffff,
      2px -2px 1px #ffffff,
      0 -2px 1px #ffffff,
      -2px -2px 1px #ffffff,
      -2px 0 1px #ffffff,
      -2px 2px 1px #ffffff,
      0 2px 1px #ffffff;
}

Внесение изменений в Common.js[править | править код]

На страницу MediaWiki:Common.js следует добавить джаваскрипт, который распознаёт присутствие шаблона {{wl}} и при необходимости подкачивает и запускает скрипты (сперва Leaflet, а затем и WikiLeaflet):

/* ***  Отрисовка геокарт [[WikiLeaflet]]  *** */
LeafletRoot = '/js/leaflet/';
ImageRoot = '/files/';
$(function () {
	// Регистрация функции для карт, подкачивающихся по CSI:
	if ($('.cs-include').length > 0) {
		window.csiPostprocessors = window.csiPostprocessors || [];
		window.csiPostprocessors.push (wlLeafletIni);
	}
	// Инициация обычных карт:
	wlLeafletIni ($(document.body));
}); // -- $(function ()

function wlLeafletIni ($obj) {
	if ($obj.find ('.wikileaf').length !== 0) {
		var WikiLeafletURL = wgScriptPath + '/index.php?title=' +
            escape( 'MediaWiki:WikiLeaflet.js' ) +
            '&action=raw&ctype=text/javascript&dontcountme=s&v=1.0';
		importStylesheetURI(LeafletRoot + 'leaflet.css');
		$.ajax ({
			url: LeafletRoot + 'leaflet.js',
			dataType: 'script',
			cache: true,
			success: function() {
				$.ajax ({
					url: WikiLeafletURL,
					dataType: 'script',
					cache: true,
					success: function () {
						wlRender ($obj);
					},
					fail: function (jqXHR, textStatus) {
						alert ('Request to ' + WikiLeafletURL + ' failed: ' + textStatus);
					}
				});
			},
			fail: function (jqXHR, textStatus) {
				alert ('Request to ' + LeafletRoot + 'leaflet.js' + ' failed: ' + textStatus);
			}
		}); // -- $.ajax (...)
	} // -- if ($obj.find ('.wikileaf').length !== 0)
} // -- function wlLeafletIni ($obj)

В переменную LeafletRoot следует поместить действительный адрес папки, содержащей библиотеку Leaflet.

Кроме того, скрипт полагается на то, что в вики определена функция importStylesheet(), способная динамически подключать стиль, заданный по его адресу от корня сайта. Пример такой функции имеется на странице MediaWiki:Common.js в Традиции.

Посредством jQuery производится вызов $.ajax() с параметром «cache: true», чтобы обеспечить кэширование обоих скриптов, невозможное при простом вызове $.getScript(). Таким образом, скрипты Leaflet и WikiLeaflet поступают в кэш к читателю вики после просмотра первой же карты, и в дальнейших картах задействуются мгновенно.

Побочным эффектом кэширования является необходимость очистки кэша после установки каждой новой версии WikiLeaflet прежде, чем новые функции начнут действовать у читателя. Простое нажатие «Shift+Обновить» во многих браузерах не приводит к повторному скачиванию кода скрипта, насильственно кэшированного вышеописанным способом. Администратору, не желающему дожидаться естественного устаревания файла в кэше, всё равно не рекомендуется устанавливать значение «cache: false» вместо «cache: true», так как это приводит к существенному замедлению демонстрации карт; вместо этого достаточно к значению WikiLeafletURL дописать некоторый суффикс («…&version=new», например) и тем невозбранно достигнуть желаемого.

Установка шаблона WikiLeaflet[править | править код]

После вышеописанных шагов остаётся только разместить в вики код шаблона {{wl}}, который и будет употребляться для непосредственного создания карт, размещения карт на страницах.

Употребление WikiLeaflet[править | править код]

Простой вызов шаблона {{wl}} создаёт на вики-странице карту. Чтобы управлять видом и содержанием карты, достаточно поместить внутрь этого шаблона (в его первый параметр) несколько других (вложенных в него) вызовов шаблона {{wl}}. Первый параметр этих вложенных шаблонов и их последующие параметры позволяют контролировать изменения, налагаемые на карту; подробности изложены на странице шаблона {{wl}}.

Примером действия шаблона {{wl}} является, например, внешний вид (итог работы) шаблона {{РМ/Карта_2010}}, состоящего из нескольких вызовов шаблона {{wl}}, а именно одного внешнего шаблона и нескольких внутренних.

Пособие по употреблению географических карт в Традиции начато на странице «Справка:Карты».

История версий WikiLeaflet[править | править код]

0.1 — 30 июня 2011 года
Первая бета-версия, установленная в Традицию. (До этого разработку Mithgol the Webmaster вёл кулуарно и версии её считал альфами.)
Эта версия оглашена на портале сообщества; шаблон {{РМ/Карта_2010}} переведён на использование WikiLeaflet.
0.2 — 4 июля 2011 года
Эта версия умеет переключаться между несколькими поставщиками тайлов: у шаблона {{wl}} появился параметр «{{wl|тайлы|имяСервераТайлов}}».
0.3 — 31 августа 2011 года
В этой версии появилась возможность размещения текстовых надписей поверх карты (подле значков, размещаемых на карте).
0.4 — 14 ноября 2011 года
В этой версии появилась возможность размещения вспомогательных панелей сбоку от карты. Одна из панелей (в режиме редактирования карты) упрощает подбор значка, устанавливаемого на карту. Другая (в режиме отображения карты) управляет скрытием и показом значков на карте в зависимости от принадлежности их к определённой категории.
0.5 — 13 марта 2012 года
В этой версии появилась возможность добавления на карту географических данных в формате GeoJSON.
0.7 — 12 марта 2015 года
Новые возможности и исправления:
  • Полный рефакторинг кода с разделением разбора конфигурации карты и её отрисовки,
  • Актуализация предлагаемых серверов тайлов,
  • Кластеризация близко расположенных значков с подбором нового значка и склеиванием надписи на карте и всплывающей надписи,
  • Возможность привязать всплывающую надпись к GeoJSON,
  • Категоризация значков и возможность включать и выключать показ отдельных категорий значков,
  • Возможность автоматического подбора начального центра карты и увеличения, чтобы уместить все объекты карты,
  • Возможность делать карту, включаемую на стороне клиента, с помощью тега <csidiv>,
  • Интерфейсы к новым возможностям LeafLet:
    • Кнопка выбора сервера тайлов и отображаемых категорий объектов (когда категоризация используется),
    • Линейка масштаба,
    • Возможность задания границ карты, которые нельзя вывести за пределы отображаемой области, в том числе, автоматически рассчитываемых.