15 заметок с меткой карта

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

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

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

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

Превьюшка и фрагмент картыПревьюшка и фрагмент карты

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

▼ Читать дальше

География проектов

Разработал галерею работ с использованием Яндекс карты для компании «Фасад-Гарант». Чтобы фотографии не накладывались друг на друга, была использована кластеризация. Превьюшки + кластеризация — это нестандартное решение, пришлось немного повозиться :)

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • След. →
  • Вид карты при загрузкеВид карты при загрузке
    Зум до Московской областиЗум до Московской области
    Зум до МосквыЗум до Москвы
    Показаны объекты менее 500 кв. метровПоказаны объекты менее 500 кв. метров
    Показаны объекты более 500 кв. метровПоказаны объекты более 500 кв. метров
    При клике на объект всплывает обычная листалка фотокПри клике на объект всплывает обычная листалка фоток

До карты на сайте был обычный список работ с превьюшками, разбитый на страницы. Такое представление неудобно с точки зрения навигации: клиент посмотрит 1-2 работы и уйдёт со страницы, потому что фотографии довольно однотипные. А вот карта даёт гораздо больше информации за несколько секунд. Видно количество работ, географический охват, какие объекты выполнены в интересующем районе. То, что фирма уже работала в данном районе, повышает доверие к ней.

Для того, чтобы сделать карту более интересной (и таким образом продлить время её изучения), я придумал кнопки изменения масштаба: Москва, Область, Россия.

При клике на Россию (и при начальной загрузке карты) делается автозум — готовая опция в Яндекс.Картах. Если бы мы показали действительно всю Россию, то работы собрались бы в мелкую кучку в районе Москвы.

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

Готовая карта поддерживается заказчиком. Организация предельно простая: текстовый файл с адресами + две папки с фотографиями работ по номерам. Также я подготовил инструкцию по установке карты на сайт, добавлению и редактированию объектов.

Определение координат полигонов на Яндекс.Картах

Яндекс запустил новый конструктор карт, и теперь собственная карта с пометками вставляется всего одной строчкой скрипта. Это удобно для большинства пользователей, но в новом коде встраивания нет координат объектов.

Выкладываю свой скрипт, который выводит координаты полигонов, центра карты и значение зума.

Клик по карте включает режим рисования полигона, следующим кликом ставится первая точка полигона (и так далее). После завершения (клик по точке → завершить) можно таким же образом рисовать следующий полигон. По нажатию кнопки в текстовом поле отобразятся координаты всех полигонов (в порядке рисования), потом центр карты и зум.

Захват большой Яндекс.Карты для печати

(Это обучающая статья. Если вы хотите заказать карту, вам сюда: plunix.ru/yandeks-ili-gugl-karta...)

В предыдущей заметке я рассказал, как захватить большое изображение (карту) по частям при помощи скриншотов и Фотошопа. Однако если есть средства для управления картой (API), то можно лёгким движением получить карту любого размера:

Такая карта получится в итогеТакая карта получится в итоге

Зачем вообще такая большая карта? Неужели нельзя проматывать её на экране, или купить карту нужной области, повесить на стенку и втыкать в неё флажки?

С помощью инструментов Яндекс.Карт на карте можно расположить «умные» метки (например, разноцветные), маршруты и любую другую информацию. Эти операции можно выполнить вручную или автоматически. Потом карта с информацией печатается, вешается на стенку: это удобно, потому что видно сразу всю карту, а не только её часть. После распечатывания остаётся возможность порисовать на готовой карте.

Или вот ещё идея: распечатать карту с крестиками, а в них воткнуть настоящие флажки. Если объектов сотня, экономится немало времени.

Захват карты в 2 шага

Нам нужно:
1) отобразить карту необходимого масштаба и размера в браузере,
2) сохранить всю страницу в виде картинки (в том числе фрагменты, выходящие за область экрана).

▼ Читать дальше

Большая карта: автоматическое выравнивание слоёв

(Это обучающая статья. Если вы хотите заказать карту, вам сюда: plunix.ru/yandeks-ili-gugl-karta...)

Иногда бывает нужна большая Яндекс- или Гугл-карта. Например, для распечатки на плакате или для создания какого-нибудь приложения.

Если у карты есть API или код вставки, используйте быстрый способ (полностью автоматический, без фотошопа). Если API нет, или вы не понимаете, о чём идёт речь, то читайте дальше.

Сейчас я расскажу, как можно быстро собрать её из кусочков (из нескольких скриншотов). Этот способ подходит не только для карт, но и для любых больших изображений, которые нельзя скачать целиком.

Склеиваем большую карту из нескольких скриншотовСклеиваем большую карту из нескольких скриншотов

▼ Читать дальше

Цветная карта округов РФ

Очередная карта России с округами. При наведении выводится подсказка, по клику — переход в нужный раздел.

Цветная карта округов РФЦветная карта округов РФ

Цвета округов легко меняются (это может сделать сам заказчик). Карта векторная → будет отлично смотреться и в небольшом баннере, и на полном экране.

▼ Читать дальше

Планы посёлков для mobilstroy.ru

Красивые двухмерные планы посёлка показывают расположение основных объектов, очерёдность застройки, наличие участков для продажи и многое другое. В данном случае на плане представлены картинки-фотки «как это будет»:

План посёлка с превьюшкамиПлан посёлка с превьюшками

На участки можно наводить или кликать мышкой для получения дополнительной информации. Цвет подсказки совпадает с цветом участка (маркировкой в зависимости от статуса участка):

Цветные подсказки к участкамЦветные подсказки к участкам

▼ Читать дальше

Как создавалась схема проезда для spmet.ru

Путь до «Металл-ателье» не совсем прост, но нам удалось показать его доступно:

Нажмите для просмотра анимацииНажмите для просмотра анимации

Это прозрачная и контрастная схема — она в равной степени хорошо смотрится и на белом фоне (при распечатывании), и на сайте компании (там бежевый фон).

По желанию заказчика была подготовлена схема в PDF, её можно посылать по почте или печатать в высоком разрешении:

Векторная схема проезда в PDFВекторная схема проезда в PDF

Далее я расскажу и покажу, как создаётся схема.

▼ Читать дальше

Океан на картах Google (часть 2)

Я уже писал про то, что спутниковые Гугл-карты земли и воды совмещены неаккуратно. Сегодня прочитал об обновлении карт:

Выпущенное Google обновление стало продуктом сотрудничества с Океанографическим институтом Скриппса и Национальным управлением океанических и атмосферных исследований США.
Обновление получило дополнительное название Google Ocean. Благодаря ему карта имеет более высокое разрешение, в нем исправлены тысячи ошибок, связанные именно с перекрытием данных.

Проверим, как всё обстоит на самом деле. Беглый поиск по карте даёт, например, вот такие результаты:

Глюки на картах Гугл - 1Глюки на картах Гугл - 2Глюки на картах Гугл - 3Глюки на картах Гугл - 4

Оперативно такие глюки не исправляются, так что пока их можно наблюдать на реальной карте:

Короче, по-прежнему очевидны грубые и местами странные следы ручной работы.

Расчёт маршрута (API Яндекс.Карт)

Доделал сервис расчёта маршрутов для сайта «МК-Лидер» (с помощью API Яндекс.Карт). Задача была непростая: внутри МКАД одни расценки, за МКАД — другие. Например, для сквозного маршрута через МКАД из Зеленограда до Красногорска нужно рассчитать 5 участков:

1) выезд от базы до Зеленограда,
2) Зеленоград — МКАД,
3) кусочек по МКАДу,
4) МКАД — Красногорск,
5) возврат из Красногорска на базу.

Кроме путей по Москве (внутри МКАД) есть маршруты сквозные, из Москвы в Московскую область (или наоборот), а также только по МО:

Маршрут через МКАДМаршрут из Москвы в МОМаршрут по МО

▼ Читать дальше

Ручная работа на картах Гугла

Пару лет назад я случайно нашёл косяк на картах в программе Google Earth:

Червячки подпортили карты Гугла :)Червячки подпортили карты Гугла :)

▼ Читать дальше

Схемы дачных посёлков

Интерактивная схема посёлка помогает лучше понять расположение участков:

▼ Читать дальше

Карта поставок из других стран

Для сайта Rainbowproduction Co. требовалось сделать красивую карту поставок продукции из других стран.

Карта тянется до любого размера, слайд-шоу увеличивается при наведении курсора:

Карта поставок: кликните для просмотра флеш-версииКарта поставок: кликните для просмотра флеш-версии

▼ Читать дальше

Схема месторождений

Простенькая схема (карта) месторождений:

Клик по любому активному объекту открывает соответствующий раздел сайта.

Карта Сумозера

Папа откуда-то надыбал карту Сумозера и окрестностей (в районе нашей деревни Ендогубы). Раскидал её на 9 листов А4 — приедем в деревню, склеим и повесим на стенку.

Апдейт. Вот раскрашенная версия и попытка наложить её на Яндекс.Карты:

Карта Сумозера (деревня Ендогуба)Карта Сумозера (деревня Ендогуба)
Карта Сумозера + Яндекс.КартыКарта Сумозера + Яндекс.Карты

(большие версии по клику)

Иван ТитовИван Титов
Фрилансер, музыкант, физтех по жизни, семьянин, философ.
© 2004...2017