Name already in use
If nothing happens, download GitHub Desktop and try again.
Launching GitHub Desktop
If nothing happens, download GitHub Desktop and try again.
Launching Xcode
If nothing happens, download Xcode and try again.
Launching Visual Studio Code
Your codespace will open once ready.
There was a problem preparing your codespace, please try again.
Latest commit
Git stats
Files
Failed to load latest commit information.
README.md
Metro Map Maker
Build the Metro system of your dreams: create your own metro maps, save them, and share with friends!
- Draw new rail lines and stations
- Autosaves after making changes
- Download your finished map as a PNG image
- Create a new map, or remix an existing map
- Get a unique URL to share your map with friends! Don’t worry — when they remix your map, you won’t lose your original!
Here are some of my favorite maps created by MetroMapMaker.com visitors like you: http://metromapmaker.com/gallery/
Made something cool?
I’d love to see it! Say hi!
This metro map was made with https://metromapmaker.com:
About
Build the Metro system of your dreams: create your own metro maps, save them, and share with friends!
Посмотрите на схему московского метро от Константина Коновалова. Она удобнее и понятнее старой

Собянинскую эпоху Москвы можно будет назвать «эпохой метро», поскольку в течение последнего десятилетия в столице ударными темпами прокладывали новые линии и строили новые станции метро. К 2021 году московская подземка разрослась до таких размеров, что в ее официальной карте уже можно потеряться. Это говорит о несовершенности существующего решения. Но какие у нас есть альтернативы?
Неофициальные схемы московского метро
Пусть разобраться в официальной схеме московского метро непросто, но что если расположить на карте все линии так, как они есть в реальности? Да, такой проект есть и он называется «Партизанская карта московского метро». Ребята, создавшие ее, пошли в обратном направлении от схемы метро Коновалова и только усложнили понимание карты.
Среди других проектов — попытки представить карту московского метро в 2050 и 2100 годах. В последнем случае фантазии художников поражают воображение и заставляют задаться вопросом, сколько времени людям потребовалось на это, и зачем? Но смотрится карта метро Москвы 2100 года действительно очень красиво.
Но вернемся с небес на землю. Сделать существующую карту московского метро проще и правда можно. Это на собственном примере показал дизайнер Константин Коновалов.
Схема метро Коновалова: как она выглядит?
Главным отличием карты Коновалова от официального варианта, разработанного студией Артемия Лебедева, является то, что в ней дизайнер ушел от круглых кольцевых линий. Главную кольцевую оставили круглой, а МЦК и БКЛ стали шестиугольными – такой подход позволил лучше всего учесть перспективу дальнейшего развития метро.
С 2010-х годов станции метро стали активно строиться за пределами центра. В систему метрополитена вошли наземные железнодорожные линии. Усложнение транспортной сети потребовало поиска принципиально новых решений для схемы, поскольку текущая версия перестала отражать реальную географию города, – говорится на сайте проекта.
Также на новой карте отображен МКАД, контур которого помогает проще ориентироваться по схеме и рассчитывать время поездки. Схема метро Коновалова показывает, как будет развиваться столичная подземка до 2030 года, поэтому на ней можно увидеть линии и станции, которых пока еще не существует.
Надеемся, что проект дизайнера заметят в администрации и смогут внедрить, ведь по этой карте и правда проще ориентироваться, а с увеличением количества станций вариант Артемия Лебедева будет становиться все сложнее. Так что, возможно, скоро ориентироваться по столичной подземке мы будем при помощи этой схемы метро, придуманной Константином Коноваловым.
Отрисовка схемы проезда в Illustrator
Довольно часто, в макете требуется разместить карту проезда, изобразить план-схему местности, показать нужные участки, нарисовать стрелочки-пути и т.д. Если копировать карту с интернета, например с Гугл-карты, то на ней плохо читаются названия улиц, номера домов. К тому же, она плохо подходит для вставки на макет.
Но так ли сложно отрисовать схему проезда самому, изобразить здания которые нужны, основные улицы, главные ориентиры, показать схемы проезда?
В этой статье я покажу, как нарисовать схему проезда в Adobe Illustrator. В итоге, получится вот такая карта с изображением пути от станции метро к магазину детских игрушек.

Поиск подходящей карты
Для рисунка, нужно взять за основу реальную карту, например, из интернета. Когда вы нашли нужный участок и он полностью отображается на мониторе, нажмите клавишу «PrintScreen», чтобы сделать фотографию экрана. По верх этой фотографии мы и будем рисовать основные ориентиры.

Откройте новый документ в программе Illustrator. И нажмите — Редактирование/Вставить. или сочетание клавиш CTRL+V. Теперь, фотографию нужно выровнять и заблокировать от перемещений.

Прорисовка основных элементов схемы
Почти все элементы схемы имеют прямоугольную форму, поэтому возьмем инструмент «Прямоугольник». Нарисуйте дороги и дома, чтобы дороги получились одинаковой толщины, копируйте их удерживая клавишу ALT. Тоже самое можно делать с другими одинаковыми элементами.

Но не все можно нарисовать прямоугольником или эллипсом. Бывают здания, парки или озера не правильной формы. В этом случае понадобится инструмент «Перо». Он позволяет расставлять точки, между которыми проходят прямые или изогнутые линии. Инструмент «Перо», при умелом использовании, позволяет получить практически любую форму.

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

Шрифт должен быть не слишком мелкий и хорошо читаемый. Поскольку карта схематическая, нет смысла подписывать абсолютно все, что на ней есть.
Добавление значков и стрелок на схеме проезда.
Помочь ориентироваться на местности могут также знаки остановки, пешеходные переходы, логотипы компаний и другие обозначения. Их тоже можно найти в интернете или нарисовать самому в стиле макета и карты.

Если вы не знаете на каком транспорте и откуда человек будет добираться, но стрелку можно не рисовать или сделать несколько версий пунктиром.
Такая отрисованная схема проезда используется при создании макета и ставится рядом с адресом и контактами. Глядя на такую схематическую карту, человеку легче сориентироваться на местности и найти нужное место.
Видео урок:
Как самому нарисовать схему проезда в Иллюстраторе.
Рисование схемы проезда в другом, более упрощенном стиле, можно посмотреть здесь.
Конструктор карт Яндекс: как сделать карту и вставить на сайт
Яндекс.Карты – это картографический сервис, который можно использовать с целью поиска конкретных объектов и для получения информации о них. Любой владелец организации может зарегистрироваться в Яндекс.Справочнике и указать на Яндекс.Карте место расположения своей компании или офиса. Конструктор карт Яндекс — сервис с помощью которого можно сделать схему проезда или список магазинов для встраивания на свой сайт.
На Яндекс.Картах любой ваш клиент может затем найти вашу организацию и проложить маршрут к ней со своего текущего местоположения.
Реклама: 2VtzquY3wEz 
При поиске в Яндексе или непосредственно на Картах пользователю показываются ближайшие к нему компании по его запросу. Это помогает привлечь клиентов, которые находятся рядом с вами.
Это наш, русский аналог Google Карт, который в некоторых случаях удобнее западного сервиса. В первую очередь, если речь идет об отечественных компаниях: Яндекс. Карты быстрее обновляют актуальную информацию для России.
Зачем нужна карта Яндекс на сайте
Ранее мы уже писали о коммерческих факторах ранжирования сайтов в поиске Яндекса . Один из них – это полный адрес, в том числе карта (желательно интерактивная) на странице с контактами.
Но это только одна из причин, почему вам необходима карта на веб-ресурсе.
Она нужна и для других целей:
- Чтобы показать клиенту, где вы находитесь, в каком районе города. Многим как раз проще ориентироваться по карте, а не по адресу.
- С помощью карты клиент сможет проложить схему проезда или маршрут, как добраться со своего текущего местоположения к вам в магазин, кафе или офис. При этом, если на сайте интерактивная карта, ему не нужно будет покидать ваш сайт.
- Если у вас несколько точек продаж или офисов, на карте вы сможете указать их все. Клиент выберет, куда ему добираться ближе, удобнее и быстрее.
Не обойтись без карты тем компаниям, которые через сайт только рассказывают о своем предложении, а завершение сделки проходит оффлайн. Это мастерские, магазины, салоны красоты, производства разного направления, аптеки и больницы. Разберёмся, как в конструкторе карт Яндекса сделать схему проезда или список адресов для установки на сайт.
Как создать карту Яндекс в конструкторе
Чтобы встроить карту Яндекса, нужно:
- Создать карту в конструкторе;
- Получить код карты;
- Вставить код на сайт (он подходит для сайтов на любой CMS).
Для создания карт есть специальный сервис – Конструктор карт Яндекс .
Если у вас есть почта на Яндексе, вы можете перейти на сервис и сразу приступать к созданию карты. Нажмите кнопку «Создать карту».

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

Давайте попробуем создать карту. Рассмотрим пример: ваш офис находится в 10 минутах ходьбы от метро. Вы хотите указать на карте маршрут от метро до своего офиса.
Первым делом называем и задаем описание своей карты (не обязательно; но так будет удобнее, особенно если карт будет несколько).

Затем приступаете к редактированию карты. На карте вы можете:
- Ставить метки;
- Рисовать линии и многоугольники;
- Указать информацию о пробках (подтягивается автоматически, об этом позаботится сам Яндекс);
- Создавать слои.
Как нарисовать схему проезда на Яндекс.Картах
Вернемся к примеру. Нам нужно указать путь от станции метро до нашего офиса. Находим нужную станцию на карте, затем выбираем инструмент «Линии» и просто рисуем путь мышкой. Затем мы можем настроить внешний вид линии: толщину, прозрачность, цвет. Как видите, конструктор сразу подсчитал, сколько метров нужно пройти.

Затем предлагаю поставить еще и метку, указывающую на офис. Выбираем инструмент «Метки», и ставим метку, просто кликнув мышкой в нужном месте. Затем настраиваем метку: пишем описание, выбираем цвет и тип.

Нажимаем «Сохранить и продолжить».

Дальше указываем тип карты:
- Интерактивная – можно увеличить, уменьшить, полноценно взаимодействовать с картой;
- Статичная – будет на сайте в виде простой картинки. Подойдет в том случае, если вы знаете, что у вашей ЦА в основном медленное соединение.
Лучше, конечно же, использовать интерактивную карту.

Яндекс.Карта с несколькими адресами
Давайте попробуем создать карту для того случая, если у вас два магазина или два офиса в одном районе.
Точно так же создаем новую карту, называем и пишем описание. Затем выбираем инструмент «Метки». Ставим метку в нужном месте и настраиваем.

Это будет указание на первый офис (магазин, салон, филиал). Теперь нужно указать еще и второй. Все делаем точно так же, только я выбираю другой цвет для этой метки – чтобы различать. Пусть будет зеленая.

Все, карта готова. Можно сохранять и вставлять на сайт. Даже если вы не можете по какой-то причине это сделать сейчас, вы всегда найдете готовые карты в списке карт:

Как добавить карту на сайт или на страницу контакты
Как я уже писала выше, после создания карты нужно скопировать код и встроить его на сайт.
После того, как создали карту, нажимаем «Получить код карты». Вы увидите кусочек кода, который нужно встроить в сайт.

Обычно карту на сайте размещают:
- На странице «Контакты»;
- В подвале (футере) сайта;
- Реже – на главной странице или странице «Доставка и оплата» (в основном, если речь идет о самовывозе).
Имея готовый код карты, вставить ее на сайт просто. Я подскажу вам несколько способов, в первую очередь для владельцев сайта на WordPress. Настройки вы сможете произвести даже самостоятельно.
Как вставить карту на сайт на WordPress
Рассмотрим, как вставить карту на сайте WordPress на страницу «Контакты». У нас на этой странице уже написан наш адрес, телефон, а внизу под всем контентом будет размещаться карта.
Заходим в административную панель сайта. Переходим в раздел «Страницы»:

Затем находим там нашу страницу «Контакты» и выбираем «Изменить». Переключаем редактор из режима «Визуальный» в «Текст». В конструкторе карт выбираем код iframe и копируем его:

В самом низу, после текста, вставляем этот код и обновляем страницу.

Вот теперь наша карта на сайте:

Отредактировать ширину и высоту можно прямо в коде, который дал Яндекс (теги width, height – задаем нужное числовое значение в кавычках).
Еще один вариант размещения карты, который часто используется на лендингах — вставить карту в футер (подвал) сайта. Для этого нужно будет отредактировать HTML-код страницы, вставив туда предложенный конструктором код.
На WordPress отредактировать футер можно через админпанель. Зайдите Внешний вид – Редактор – Подвал:

Чтобы отредактировать файл, нужно иметь хотя бы базовые знания HTML. Если с этим у вас все не так хорошо, лучше доверьте работу веб-разработчику (найти умельца можно даже на фрилансе).
Плагины Яндекс.Карт
Для разных CMS можно использовать официальные плагины карт, или модули, которые позволяют провести быструю интеграцию.
- Для 1С Битрикс: «Ваша сеть офисов на карте» и «Яндекс.Карта объектов инфоблока»;
- Для Drupal: «Geofield Yandex Maps»;
- Для WordPress: «Yandex Maps API»;
- Для Joomla!: «Яндекс.Карты для Joomla» и другие.
Полный список плагинов вы можете посмотреть в Справке Яндекса.
Как видите, сделать и встроить карту Яндекс на сайт не так и сложно, и с базовым знанием HTML это вполне можно сделать самостоятельно.
Позаботьтесь о своих клиентах и помогите им быстрее найти ваш магазин, ресторан, салон красоты или офис. Создайте карту и разместите ее у себя на сайте.