Данное руководство поможет вам добавить тип "yandexMaps" для того, чтобы удобно получать координаты любого объекта. Это один из первых моих опытов работы с MODX:Revo, он был использован для создания карты магазинов. С помощью него намного удобнее получать координаты нужного места: реализован поиск, регулировка масштаба и перенос маркера.
Для установки вам потребуется:
- установленный MODX:Revo
- аккаунт-паспорт на yandex.ru
- api-ключ для работы (получить можно на этой странице)
- работоспособные brain.exe и hands.dll + 5 минут свободного времени
1. Для начала создадим файл в категории core/model/modx/processors/element/tv/renders/mgr/input/
файл map.php
$this->xpdo->lexicon->load('tv_widget');
return $this->xpdo->smarty->fetch('element/tv/renders/input/map.tpl');
2. Далее, создадим файл manager/templates/default/element/tv/renders/input/map.tpl
Внимательно просмотрите код, вам потребуется заменить "api_ключ" на нужное вам значение
<!--
//***********************************
// yandexMaps v1.0 for MODx Revo
//***********************************
// Sergey `3ap` Nazarjev - http://nopreset.ru
// Thanks for: Eugeny `zk` Krylov
//***********************************
// Description: Custom TV-input for more comfortable getting coordinates of needed places
//***********************************
-->
<script src="http://api-maps.yandex.ru/1.1/index.xml?key=api_ключ" type="text/javascript"></script>
<div style="margin-bottom: 30px;"><input type="text" style="width: 500px; margin-right: 10px; padding: 0;" id="YMapsInput"><button style="width: 100px; padding: 0; margin: 0;" onclick="enter()">Найти!</button></div>
<div id="YMapsID" style="width: 620px; height: 300px;"></div>
<input id="tv{$tv->id}" name="tv{$tv->id}" type="hidden" class="textfield" value="{$tv->get('value')|escape}" tvtype="text"/>
<script type="text/javascript">
{literal}
var map = -1
var placemark = -1
var tv = document.getElementById('{/literal}tv{$tv->id}{literal}')
window.onload = function () {
var x = tv.value.substr(0, strpos(tv.value, ",", 0))
var y = tv.value.substr(strpos(tv.value, ",", 0)+1, tv.value.length)
if(!x) x = 0.0;if(!y) y = 0.0;
map = new YMaps.Map(document.getElementById("YMapsID"));
map.setCenter(new YMaps.GeoPoint(parseFloat(x), parseFloat(y)), 10);
map.addControl(new YMaps.Zoom());
placemark = new YMaps.Placemark(map.getCenter(), {draggable: true})
map.addOverlay(placemark)
YMaps.Events.observe(placemark, placemark.Events.DragEnd, function (obj) {
tv.value = obj.getGeoPoint().getX() + ',' + obj.getGeoPoint().getY()
MODx.fireResourceFormChange();
});
};
function strpos(haystack, needle, offset){
var i = haystack.indexOf( needle, offset );
return i >= 0 ? i : false;
}
function enter() {
var geocoder = new YMaps.Geocoder(document.getElementById("YMapsInput").value, {results: 1});
YMaps.Events.observe(geocoder, geocoder.Events.Load, function (geocoder) {
placemark.setGeoPoint(this.get(0).getGeoPoint());
map.panTo(this.get(0).getGeoPoint());
tv.value = this.get(0).getGeoPoint().getX() + ',' + this.get(0).getGeoPoint().getY()
MODx.fireResourceFormChange();
});
}
{/literal}
</script>
3. Теперь вы можете создать TV-параметр
3.1 Зайдите в www.ваш_сайт.ru/manager/index.php?a=22
3.2 Введите любое название и заголовок, после перейдите на вкладку Параметры ввода
3.3 Щёлкните на список (по умолчанию там стоит "Текст - Text") и выберите "map"
3.4 Перейдите на вкладку "Доступно для шаблонов" и выберите нужные Вам шаблоны.
4. Теперь на странице редактирования документов с шаблонами, которые Вы выбрали выше, появится дополнительное поле, схожее с тем, которое изображено на скриншоте выше.
Спасибо за установку!