0

У меня есть карта, которую я сделал в конструкторе Яндекс.Карт: https://jsfiddle.net/s0ztux7h/1/

<div class="map">
<iframe src="https://yandex.ru/map-widget/v1/?um=mymaps%3Agt47h-7lyHIil6MW3OyTYnTKLgw9k8AA&amp;source=constructor" width="100%" height="800px" frameborder="0">
</iframe>
</div>

Хочу добиться от карты с width="100%", чтобы при изменении разрешения экрана (а именно его ширины) левый край карты оставался на виду (у меня там находится плашка), притом это должно работать не в дискретном наборе разрешений экрана, а по умолчанию. Как я понял, дефолтное поведение карты: центрировать по выбранному изначально в конструкторе окну. Как можно изменить это поведение?

P.S. Мне не подходит решение с заданием ширины в абсолютных единицах.

Заранее спасибо!

6
  • Центр карты всегда остается в центре контейнера по ширине. Можно подобрать для минимального размера экрана центр карты так, чтобы метка была слева в видимой области, тогда при ресайзе окна она будет оставаться в видимой области (но всё равно будет "уезжать" от левого края). Все более точные настройки можно сделать только в JS API.
    – Reni
    17 авг 2018 в 17:19
  • Спасибо за ответ! Думаю, мне подойдёт такое решение. 17 авг 2018 в 17:29
  • можете вместо конструктора использовать апи, и при изменении разрешения экрана дать центр карты вот так. map.setBounds([[minX,minY],[maxX,maxY]]);. 17 авг 2018 в 17:44
  • @RazGalstyan, простите, не очень понятно, как это поможет: мне нужно, чтобы маркер был при любом разрешении был в одном и том же месте относительно экрана, причём не в центре карты, а в левом верхнем углу. 17 авг 2018 в 18:00
  • @EduardGrigoryev ну если в этой функции где задается центр карты дать другие значения, тоесть разчитать немного иначе то будет то что вам нужно, но это при использовании апи а не конструктора. 17 авг 2018 в 18:03

1 ответ 1

0

Стоит задать отступ для метки, которая должна находиться в углу, а после, определяя её пиксельные координаты и размер карты смещать центр карты на половинный размер карты минус отступ.

При этом дальше следует отслеживать изменение границ карты, чтобы ловить момент изменения масштаба или её размеров, и вызывать функцию смещения центра повторно.

//Координаты метки
var coords = [55.753994, 37.622093];
//Задаём отступ метке от угла:
var x1 = 120, y1 = 50;

mapOffset()

myMap.events.add('boundschange', function () {
    mapOffset()
});

function mapOffset() {
    var pixelCoords = myMap.options.get('projection').toGlobalPixels(coords, myMap.getZoom())
    var mapSize = myMap.container.getSize()
        myMap.setGlobalPixelCenter([pixelCoords[0] + mapSize[0] / 2 - x1, pixelCoords[1] + mapSize[1] / 2 - y1]);
}

Пример: https://jsfiddle.net/mhne5btg/1/

Ваш ответ

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

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