0

Встраиваю карты в мобильное приложение. Мне понадобилось сделать управление масштабом карты в виде двух круглых кнопок (+) и (-). Взял пример от Яндекс, слегка изменил и сделал свой zoomControl (код см. ниже). Но вот незадача - при двойном щелчке кнопки увеличиваются вместе с картой. Пробовал навешивать обработчик на dblclick на ZoomControl и на всю карту, пробовал фильтровать события сlick, но все это не помогло.

// Creating a custom layout for the zoom slider.

ZoomLayout = ymaps.templateLayoutFactory.createClass("<div>" +

"<div id='zoom-in' class='button'><img src='mb2capp://plus.png' width='100px' height='100px'></div><br>" +

"<div id='zoom-out' class='button'><img src='mb2capp://minus.png' width='100px' height='100px'></div>" +

"</div>", {

/**

* Redefining methods of the layout, in order to perform

* additional steps when building and clearing the layout.

*/

build: function () {

// Calling the "build" parent method.

ZoomLayout.superclass.build.call(this);

/**

* Binding handler functions to the context and storing references

* to them in order to unsubscribe from the event later.

*/

this.zoomInCallback = ymaps.util.bind(this.zoomIn, this);

this.zoomOutCallback = ymaps.util.bind(this.zoomOut, this);

// Beginning to listen for clicks on the layout buttons.

$('#zoom-in').bind('click', this.zoomInCallback);

$('#zoom-out').bind('click', this.zoomOutCallback);

},

clear: function () {

// Removing click handlers.

$('#zoom-in').unbind('click', this.zoomInCallback);

$('#zoom-out').unbind('click', this.zoomOutCallback);

// Calling the "clear" parent method.

ZoomLayout.superclass.clear.call(this);

},

zoomIn: function () {

var map = this.getData().control.getMap();

map.setZoom(map.getZoom() + 1, {checkZoomRange: true});

},

zoomOut: function () {

var map = this.getData().control.getMap();

map.setZoom(map.getZoom() - 1, {checkZoomRange: true});

}

}),

zoomControl = new ymaps.control.ZoomControl({options: {layout: ZoomLayout}});

myMap.controls.add(zoomControl, { float: 'none', position: {right: '50px', top: '250px'} });

2 ответа 2

2

Добавьте на страницу meta например такую <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" /> Подробней можно почитать тут: https://www.w3schools.com/cSS/css_rwd_viewport.asp

1
  • Работает! Спасибо большое!
    – vitas168
    20 мар 2018 в 14:48
0

Почему-то часть кода искорежилась при отправке. Вначале стоит следующий код:

// Creating a custom layout for the zoom slider. ZoomLayout = ymaps.templateLayoutFactory.createClass("" + "
" + "" + "", {

/** * Redefining methods of the layout, in order to perform * additional steps when building and clearing the layout. */ build: function () { ...

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.