Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.64/11: Рейтинг темы: голосов - 11, средняя оценка - 4.64
23 / 23 / 11
Регистрация: 04.12.2012
Сообщений: 579

Интерактивная карта

03.05.2018, 08:56. Показов 2465. Ответов 3
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Здравствуйте. Подскажите, как можно сверстать подобного рода карту, как на скрине? Сама карта России - просто изображение, и на него накладываются маркеры. Просто сверстать такую карту и через absolute координаты проставить - не составит труда. Но как это дело тогда адаптивить? Или есть способ получше?
Миниатюры
Интерактивная карта  
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
03.05.2018, 08:56
Ответы с готовыми решениями:

Интерактивная карта (изображение)
Пытаюсь создать Map area карты Москвы при помощи ресурса http://ru.crazysquirrel.ru/#!image_to_map_area. Открываю в Dreamweaver CS6 - все...

Интерактивная карта для сайта
Ребята подскажите как создать вот такую карту как тут http://obyavleniya.info/ сам svg фаил я сделал вот он...

Интерактивная карта по федеральным округам РФ
Помогите, пожалуйста, плохо разбираюсь в скриптах. И вообще можно ли без них обойтись в данном случае? http://www1.fips.ru/tiscs Нужно...

3
333 / 309 / 168
Регистрация: 02.06.2014
Сообщений: 1,130
03.05.2018, 10:08
Цитата Сообщение от Dmitrin Посмотреть сообщение
Или есть способ получше?
Вам нужно копать в сторону SVG + JS
Что-то типа такого
0
23 / 23 / 11
Регистрация: 04.12.2012
Сообщений: 579
03.05.2018, 10:18  [ТС]
А как это дело заадаптивить можно?) Просто скролл показывать?
0
Эксперт HTML/CSS
 Аватар для Fedor92
2964 / 2621 / 1068
Регистрация: 15.12.2012
Сообщений: 10,091
Записей в блоге: 11
03.05.2018, 10:22
Цитата Сообщение от Dmitrin Посмотреть сообщение
А как это дело заадаптивить можно?)
ИМХО, только на js... При изменении окна пересчитывать координаты маркеров...
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
03.05.2018, 10:22
Помогаю со студенческими работами здесь

Интерактивная карта для сайта
Всем доброго времени суток! На этом сайт, на Главной есть карта России. При наведении на регион он меняет цвет. Мне нужно сделать...

Интерактивная карта, скошенные границы
Как сделать скошенные границы сверху и снизу сайта (см. скрин) Чтобы не затрагивать область интерактивной карты.

SVG интерактивная карта, съезжают области
Приветствую, требуется создать кликабельную интерактивную карту. Взял за урок ролик с ютуб. При реализации данного урока возникли некие...

Интерактивная диаграмма
Нужно нарисовать диаграмму типа этой http://tympanus.net/Tutorials/AnimatedSkillsDiagram/ , только нужно чтоб каждая дуга увеличивалась в...

Интерактивная картинка SVG
Добрый день, я в HTML новичок, и вот столкнулся с такой задачей: требуется сделать интерактивную картинку SVG, пример картинки прикрепил в...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
4
Ответ Создать тему
Новые блоги и статьи
Настройки VS Code
Loafer 13.04.2026
{ "cmake. configureOnOpen": false, "diffEditor. ignoreTrimWhitespace": true, "editor. guides. bracketPairs": "active", "extensions. ignoreRecommendations": true, . . .
Оптимизация кода на разграничение прав доступа к элементам формы
Maks 13.04.2026
Алгоритм из решения ниже реализован на нетиповом документе, разработанного в конфигурации КА2. Задачи, как таковой, поставлено не было, проделанное ниже исключительно моя инициатива. Было так:. . .
Контроль заполнения и очистка дат в зависимости от значения перечислений
Maks 12.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: реализовать контроль корректности заполнения дат назначения. . .
Архитектура слоя интернета для сервера-слоя.
Hrethgir 11.04.2026
В продолжение https:/ / www. cyberforum. ru/ blogs/ 223907/ 10860. html Знаешь что я подумал? Раз мы все источники пишем в голове ветки, то ничего не мешает добавить в голову такой источник, который сам. . .
Подстановка значения реквизита справочника в табличную часть документа
Maks 10.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: при выборе сотрудника (справочник Сотрудники) в ТЧ документа. . .
Очистка реквизитов документа при копировании
Maks 09.04.2026
Алгоритм из решения ниже применим как для типовых, так и для нетиповых документов на самых различных конфигурациях. Задача: при копировании документа очищать определенные реквизиты и табличную. . .
модель ЗдравоСохранения 8. Подготовка к разному выполнению заданий
anaschu 08.04.2026
https:/ / github. com/ shumilovas/ med2. git main ветка * содержимое блока дэлэй из старой модели теперь внутри зайца новой модели 8ATzM_2aurI
Блокировка документа от изменений, если он открыт у другого пользователя
Maks 08.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа, разработанного в конфигурации КА2. Задача: запретить редактирование документа, если он открыт у другого пользователя. / / . . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru