JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/js/materialize.js"></script>
<script src="http://api-maps.yandex.ru/2.1/?lang=ru_RU&coordorder=longlat"></script>
<script src="https://api-maps.yandex.ru/2.1/?lang=ru_RU&coordorder=longlat"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/css/materialize.min.css">
<script src="https://sommer2016.s02.wh1.su/geojson.json"></script>
<div id="map"></div>
CSS
#map {
width: 640px;
height: 320px;
}
JavaScript
ymaps.ready().done(function (ym) {
var myMap = new ym.Map('map', {
center: [37.659838, 55.611104],
zoom: 19,
controls: [],
searchControlProvider: 'yandex#search'
}),
// Создадим собственный макет выпадающего списка.
ListBoxLayout = ym.templateLayoutFactory.createClass(
"<a id='cityDropdown' class='waves-effect waves-blue blue darken-2 btn clearReg dropdown-button' data-activates='dropdown_city'>" +
"{{data.title}}" + "</a>" + "<ul id='dropdown_city' class='dropdown-content'></ul>", {
build: function () {
// Вызываем метод build родительского класса перед выполнением
// дополнительных действий.
ListBoxLayout.superclass.build.call(this);
this.childContainerElement = $('#dropdown_city').get(0);
// Генерируем специальное событие, оповещающее элемент управления
// о смене контейнера дочерних элементов.
this.events.fire('childcontainerchange', {
newChildContainerElement: this.childContainerElement,
oldChildContainerElement: null
});
},
// Переопределяем интерфейсный метод, возвращающий ссылку на
// контейнер дочерних элементов.
getChildContainerElement: function () {
return this.childContainerElement;
},
clear: function () { this.events.fire('childcontainerchange', {
newChildContainerElement: null,
oldChildContainerElement: this.childContainerElement
});
this.childContainerElement = null;
// Вызываем метод clear родительского класса после выполнения
// дополнительных действий.
ListBoxLayout.superclass.clear.call(this);
}
}),
// Также создадим макет для отдельного элемента списка.
ListBoxItemLayout = ym.templateLayoutFactory.createClass(
"<li><a>{{data.content}}</a></li>"
),
// Создадим 2 пункта выпадающего списка
listBoxItems = [],
a =...