Создаем интерактивные карты для вашей компании


Хотелось ли вам создать интерактивную карту для своей компании? Такую чтобы с пометками, поиском да работающую на любых устройствах?
Мне хотелось, поэтому вот обещанный туториал по mashupforge.

Вообще сервис позволяет делать карты и без регистрации, но для последующего редактирования и удобного менеджмента уже созданных карт мы пойдем чуть более длинным путем:
  1. Итак, заходим на mashupforge.com/
  2. В правом верхнем углу нажимаем Sign In / Sign Up
  3. Выбираете своего провайдера OpenID (у меня это google), и щелкаете на его иконку
  4. Далее, в зависимости от провайдер вас попросят принять условия или ввести пароль, в общем соглашаемся и продолжаем
  5. В левом верхнем углу нажимаем Maps и попадаем в режим редактирования карты
  6. Далее заходим в меню Layers и нажимаем кнопку [Upload new image]
  7. Ждем пока изображение загрузится, и снова переходим в меню Maps
  8. Нажимаем кнопку [Create new map]
  9. В поле Map Name даем карте название
  10. Раскрываем элемент Base Layer и выбираем только что загруженное изображение
  11. Далее в других элементах можете настроить цвета, стили отображения и пр. но это все опционально
  12. Нажимаем кнопку [Save] и ваше изображение появляется вместо карты мира — можно наносить интерактивные пометки!
  13. В правом нижнем углу выбираем элемент, который хотим поставить на карту: Marker — точка, Line — линия, Area — замкнутая область
  14. Ставим элемент двойным щелчком на карте *
  15. Прописываем ему заголовок, описание, выбираем стиль отображения и нажимаем кнопку [Save]
  16. Повторяем до тех пор, пока не поставим все элементы
  17. Когда поставили все элементы, нажимаем кнопку [Link / Embed], копируете верхнюю ссылку и отдаете её своим игрокам. Пример: mashupforge.com/6769/G1bakj/
  18. Изменения сохраняются автоматически, и все созданные вами карты будут перечислены в меню Maps
  19. ???
  20. Profit!

При этом, если водите по нашему миру — пункты 6-7 можно проустить, и ставить маркеры на спутниковой или дорожной карте Земли.

* Для линейного и площадного элементов: начало рисования — двойной щелчок, добавить узел — один щелчок, завершение рисования — двойной щелчок.

** В меню Marker Types можно создавать «типы маркеров» — шаблоны информации маркера, который можно использовать для облегчения создания нескольких маркеров с аналогичными свойствами и сгруппировать их. Например создать типы маркеров: Деревни, Двигатели, Неразведанные места и пр.

*** Вы можете загрузить свое собственное изображение в качестве значка маркера!

16 комментариев

avatar
Я джва года такой сервис искал, чтобы можно было со своими картами работать — а тут еще и кастомные маркеры и вставка кода на страницу. Спасибо громадное!
avatar
Пожалуйста)
avatar
Спасибо. Хотел спросить, вдруг вы в курсе(не знаю пока, когда доберусь до того, что бы попробовать самому). Каких размеров поддерживается карта?
В свое время я занимался поиском подобного ресурса, и не слишком успешно. Теоретически можно использовать Google и Yandex карты. Но там много головняка, и я столкнулся с тем, что бесплатные утилиты не хотят работать с размером карты 25000 на 25000. Нашел в результате какую-то, то ли от микрософта, то ли просто написанную силверлайт. Не суть. Она тоже не поддерживала сильно большие карты, уменьшал кажется то ли до 15к, то ли до 10к. Зато там не надо было думать, посто аплоадить картинку и все. Ну и маркеров и меток там не было, а это уже совсем грустно…
avatar
До 60 мегапикселей. Если брать квадраты — то 7700 на 7700 примерно. Больше — только на премиумах, по которым нужно писать авторам напрямую.
P.S.: Иконки на сервисе можно брать с этого сайта. Полчища иконок, семь стилей на каждую плюс настройка нужных цветов (фона и самого изображения) по тому же RGB.
avatar
Чуть уточню: You can upload an image (Max 15 MB or 60 Megapixel for free accounts) in JPEG, PNG or TIFF formats
avatar
Не густо, но на безрыбье и рак рыба :) Буду потом пробовать… Спасибо за ответ! :)
avatar
А вставить в сайт, как гугл карты можно? Или только по открытию?
avatar
Можно!
Для этого на шаге 17 копируете не верхнюю ссылку, а нижний код и вставляете его в html.
avatar
Шикарно! ))) Можно прямо блог посвященный кампейну сделать или для форумного проекта запилить. Раньше приходилось код самому писать…
avatar
Можно блог, а можно и на гугл сайтах — как тут: dnd-5e.zem55.org/
Туториал по ним тоже будет.
avatar
А как сделать, как в дефолтной карте мира? Чтобы когда приближаешь появлялась локальная карта?
avatar
В этом сервисе никак, тайлы автоматически делаются уменьшением исходного изображения.
Но есть простое административное решение — если локальные карты нужны только на определенные места — города, базы, оазисы, (а обычно это так и есть):
1. Сделать глобальную карту, с метками в местах интереса
2. На все места интереса сделать отдельные карты
3. В метках на глобальной карте указать ссылки на карты мест интереса
avatar
А нельзя дать доступ к редактированию другим пользователям?
avatar
И как сделать линию жирной как у тебя на пикче?
avatar
А все, нашел
avatar
Регистрация на mashupforge.com/ приказала долго жить.
Не логинится ни у меня, ни у наших иностранных коллег.
На фейсбуке автора есть запись от 11 мая, мол скоро поправим, но так ничего и не произошло.

Есть на примете аналогичный сайт?
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.