Как сделать масштаб на Яндекс карте?

Яндекс или Гугл карта для печати на бумаге в масштабе с пометками

Ко мне всё чаще обращаются люди по поводу бумажной карты города. Я не занимаюсь печатью, но могу подготовить любую карту для печати в большом размере. Когда-то я рассказал, как скачать Яндекс.карту в виде картинки, но таким образом вы получаете «голую» карту. Если нужно что-то более интересное, отправляйте задание мне на почту или звоните (телефон есть в Контактах). Какие-то вещи можно сделать при помощи Яндекс.API, но большая часть работы делается вручную. Например, автобусные остановки есть на картах, но они мелкие и без названий, и нет инструмента, чтобы «вытащить» их координаты и названия. Если нужно красиво и читабельно — их придётся расставлять вручную. Вот примеры заказов:

Карта Серпухова с отмеченными участками дорог

Задание: разделить цветом выполненные и планируемые работы по ремонту дорог, указать улицу, площадь и стоимость работ.

Для красоты я выделил город Серпухов жирной линией и высветлил остальную часть карты. Здесь не всё так просто: Яндекс (или Гугл) выделяет области очень тонкой линией (она не видна при печати). Пришлось брать за основу контур от Яндекса, отделять его от фона с помощью Фотошопа, затем переводить в вектор, чтобы итоговая граница была красивая и ровная при печати на большом формате.

Карта побережья с указанным масштабом в углу

Задание: подготовить карту в масштабе 1:250 или 1:500 (чтобы влезла нужная область и при этом карта была не шире 1 метра, это ограничение типографии).

Я делал так: выхватил с карты заведомо большую область, затем подогнал картинку под нужный размер, чтобы соблюдался определённый масштаб. Я ориентировался на «пруд»: измерил его по вертикали «линейкой» от Яндекс.Карт, получилось 532 метра. В масштабе 1:500 данный «пруд» должен занять 1,064 метра. Ну а дальше — дело техники.

Карта всех точек продаж в городе

Задание: сделать карту формата А3, на которой указаны все точки продаж конкретного магазина. На сайте этого магазина карта маленькая, и на ней умещаются одновременно только 2-3 метки. Если её отдалить, то влезают все метки, но тогда не видно названий улиц.

Конечно, можно скроллить карту в разные стороны, наделать принтскринов, а потом склеить по частям, но гораздо быстрее сделать это автоматически. Но не пытайтесь делать это сами: обычно такие карты разрабатываются под каждый магазин индивидуально, и не существует универсального способа их скачать целиком или запустить у себя на компьютере. Без навыков программирования тут не обойтись.

Заказ и оплата

Если карта сложная, то необходим аванс 50%. Если карта несложная, могу приступить к работе без аванса. В конце работы я отправлю вам превью и фрагмент карты в натуральную величину. Если всё устраивает, вы переводите оплату, и сразу после получения денег я передам вам карту для печати (или ссылку на неё).

plunix.ru

Копирование яндекс карт большого рамера

Администратор

Пользователь sever разместил новый ресурс:

Копирование яндекс карт большого рамераПростой способ копирования яндекс карт

Для копирования яндекс карт необходимо перейти по ссылке http://dimik.github.io/ymaps/examples/location-tool/
найти интересующее место, скопировать ваши координаты и вставить в Yamap.html.
Yamap.html можно открыть блокнотом или notepad ++.
Укажите необходимое вам приближение от 1 до 21 .
Укажите размер загружаемой.

Администратор

Хочется добавить следующее.
Как масштабируются яндекс карты?
Всего существует 21 масштаб от одного до двадцати одного.
Посмотреть маштаб карты можно в адресной строке.

Как перевести этот масштаб в привычный нам?
В правом нижнем углу всегда отображается масштаб

но это не привычная нам сантиметровая разметка. Можно было бы подумать, что в одном сантиметре 400 метров! Но это ни так!
Если линейкой померить, то получается, что в 14 мм 400 м.
400 : 14 = 28,57 м в одном мм
то бишь 285,7 м в одном сантиметре.

Получается, что при масштабе (зуме) 14 в одном сантиметре 285,7 метра.

severforum.ru

Всякое разное про front-end

В данной статье я хочу начать цикл статей по работе с API Яндекс.Карт. Документация Яндекс.Карт достаточно полна, но степень разрозненности информации в ней высокая, при первом заходе в документацию без пол-литры не разобраться, и для решения какой-то проблемы можно потратить много времени на поиск по документации и в поисковике. Этот цикл статей будет рассказывать о практических решениях наиболее частых случаев использования API Яндекс.Карт последней, на момент написания статьи, версии 2.1.

При вёрстке сайта в контактной информации часто бывает необходимость вставки карты, на которой будет отмечено местоположение организации, для которой разрабатывается сайт. В самых простых случаях это может быть просто скриншот c онлайн-карт (или не онлайн):

Для вставки интерактивной карты может использоваться конструктор карт
https://tech.yandex.ru/maps/tools/constructor/:

В случае, если нам нужно более продвинутое использование карт (свои метки, программное перемещение карт и т.п.), то для этого надо использовать API Яндекс.Карт: https://tech.yandex.ru/maps/jsapi/. В качестве примера использования карт в статье будет рассмотрено создание карты с простым добавлением пользовательских метки и балуна.

Для начала подключим компоненты API:

Если разрабатывается какое-то большое приложение с использованием карт, то лучше подключать компоненты API определённой версии, чтобы при обновлении API на стороне Яндекса у нас ничего не сломалось на продакшине:

Карту необходимо будет расположить в каком-нибудь блоке, например в div#map. Далее карту необходимо создать в данном блоке (после срабатывания события готовности карты и DOM):

Здесь мы указываем:

1. идентификатор блока «map», где у нас будет создана карта;
2. center — центр карты с указанием ширины и долготы;
3. zoom — коэффициент масштаба карты.

По умолчанию Яндекс.Карты создают много лишних элементов, которые в большинстве случаев не нужны на сайтах. В основном к элементам управления и к поведению карты достаточно применить 2 условия:

1. из элементов карты присутствует только ползунок изменения масштаба;
2. карта не должна менять масштаб скроллом мыши.

Для выполнения этих требований дополняем код:

Здесь мы отключили «scrollZoom» и добавили «zoomControl» с позиционированием от левого верхнего угла.

Теперь нужно добавить на карту метку, для статьи скачаём её картинку с http://medialoot.com/item/free-vector-map-location-pins/ и расположим в коде следующим образом:

Здесь мы объявляем переменную myPlacemark, в которой запишем маркер, в первом параметре ymaps.Placemark указываем координаты метки, а в третьем параметре:

1. указываем в iconLayout, что будет использоваться пользовательское изображение метки;
2. iconImageHref — путь к изображению;
3. iconImageSize — указываем размеры изображения;
4. iconImageOffset — указываем сдвиг от левого верхнего угла картинке к точке изображения, которая показываем на нужный нам объет. Нужно это чтобы при масштабировании карты положение метки не сбивалось. Почему смещение указывается в отрицательных значениях — одному Богу создателю API известно.

И через myMap.geoObjects.add() добавляем метку на карту.

А теперь сделаем баллун, который у нас будет показываться при клике на метку карты, макет баллуна и его содержимое возьмём с http://designdeck.co.uk/a/1241

Здесь мы:

1. в balloonContent указываем контент, который будет отображаться при открытии балуна;
2. balloonLayout — указываем, что в качестве макета баллуна будет использоваться пользовательское изображение;
3. balloonContentSize и balloonImageSize — размеры контента и изображения соответственно;
4. balloonImageHref — путь к изображению;
5. balloonImageOffset — смещение относительно левого верхнего угла;
6. balloonShadow — отключение тени у балуна (с пользовательскими изображениями ни на что не влияет).

blog.karmanov.ws

Как распечатать карту Яндекс

Делаем скриншот карты Яндекс (нажмите для увеличения)

В прошлой статье мы с вами разобрались как сохранить карту из Google Maps. 1 и 3 способы — универсальны и отлично работают для сохранения карт Яндекса. Здесь расскажу еще один способ.

Как сохранить большую карту Яндекса без программ

За этот способ спасибо Ивану Титову . Расскажу как я буду его использовать. Нам понадобится:

• Браузер (буду использовать Google Chrome);
• Расширение для создания скриншотов ( Nimbus Screenshot );
• Yamap.zip — [458 байт], который нужно будет настроить под себя.

Запускаем Goolge Chrome, устанавливаем расширение Nimbus Screenshot и скачиваем Yamap.zip. Распаковываем архив и открываем файл с помощью блокнота или Notepad++ . Содержимое HTML файла выглядит следующим образом. Стрелочками показаны места где нужна настройка.

Выбираем центр той местности, которая нам нужна и копируем значение «Центр карты» в center: [49.34601652, 23.52472478]. Выбираем масштаб и устанавливаем значение — zoom.

задаем размер. То есть изменяем значение width и height чтобы поместилось вся нужная территория.

Сохраняем файл Yamap.html и открываем в Google Chrome.

Сохраняем скриншот всей страницы и жмем «Готово» в правом верхнем углу. Если Nimbus Screenshot не работает с картой, проверьте настройки приложения . Это не сайт, а файл, открытый при помощи браузера по ссылке, поэтому программе нужно соответствующее разрешение .

Сохраняем получившееся изображение в компьютер или сразу распечатываем.

printerprofi.ru