|
|
Модератор форума: o_Lisovenko, JonMagon |
Сообщество uCoz Вебмастеру Инструменты и софт для вебмастера Создание навигационных карт (Программы для создания навигационных карт для html-страниц.) |
Создание навигационных карт |
Коллеги, не подскажите какие есть инструменты (программы) для визуального создания навигационных карт или по-другому для разметки изображений на области с сылками, т.е. того что в HTML описывается тэгом <MAP> ?
Спасибо! PS Речь идёт не о создании этих карт под ключ в визуальном редакторе, а хотя бы обрисовке нужной многоугольной области с получением координат её углов. Добавлено (09 Мар 2013, 22:01:33) --------------------------------------------- Ну пока "суть да дело" - кому праздники, а кому работа, - нашёл то что спрашивал. Есть такая штука Редактор карт изображений на javascript с описанием создания сей программы. Правда так и не понял кто автор статьи и, соответственно автор программы. В первом чтении попробовал - понравилось! Ещё одна нашлась под названием Imagination Image Map Editor от Multimedia Australia, правда хотя и предоставляется для скачивания free-версия, но реально оказывается, что бесплатная она только на 20 запусков, в общем ни какая она не бесплатная, а банально trial - пробная. Пишут ещё на просторах интернета, что такую задачу можно решить с помощью Фотошопа в купе с ИмиджРеди (когда они вместе шли, по-моему до 8-й версии, но сейчас Фотошоп поставляется в гордом одиночестве). Сообщение отредактировал EsKorTwo - Суббота, 09 Мар 2013, 22:03:01
|
EsKorTwo, не советую вам пользоваться всякими хелперами напичканными графической оболочкой. Как говорится - профессионального лётчика не заменит ни один компьютер, и в программировании тоже самое. Просто с визуальными редакторами вы рискуете получить не совсем то, что хотелось бы.
Вам помогут, если прикрепите:
- Ссылку на сайт - Скриншот проблемы через встроенное прикрепление изображений - HTML (CSS) Код проблемного участка в спойлере |
Цитата (-=WaMpIr=-) не советую вам пользоваться всякими хелперами напичканными графической оболочкой. Как говорится - профессионального лётчика не заменит ни один компьютер, и в программировании тоже самое. Представьте рисунок, например 1000х500px. Где-то на нём находится фрагмент, контур которого представляет сложную геометрическую фигуру. На него нужно повесить ссылку - как глазами, под лупой, с микроскопом, загибая пальцы или рисуя палочки на бумаге чтоб не забыть, будете отсчитывать пикселы на картинке чтобы определить координаты вершин сей фигуры? Можно, конечно, но так скоро и "помереть" можно или ослепнуть вконец. А с помощью например, первой, указанной в прошлом "посте", программы это сделать не сложно: загружаю в прогу картинку, общёлкиваю контур и получаю список координат вершин получившейся фигуры - этого мне уже достаточно, большего и не нужно, хотя программа позволяет полностью получить код тэга <MAP> со всем содержимым. |
EsKorTwo, А не проще ли поверх изображения div_ами - с ссылками с position: absolute; или чисто ссылками с position: absolute;
Цитата контур которого представляет сложную геометрическую фигуру Проблема в том что многогранник, как сетка координат тега MAP считается устаревшей и не рекомендуется к применению ... Сообщение отредактировал Miss_Esq - Понедельник, 11 Мар 2013, 22:24:25
|
Цитата (Miss_Esq) А не проще ли поверх изображения div_ами - с ссылками с position: absolute; или чисто ссылками с position: absolute; |
EsKorTwo, Видимо как то что то есть для этого, но как правило, например типа карты географические представлены скриптом а не тегом MAP. Для простого тег MAP подходит, а вот для сложного контура, нереально большой код получается ..
|
Цитата (Miss_Esq) Для простого тег MAP подходит, а вот для сложного контура, нереально большой код получается .. Например для треугольника - это три пары координат, т.е. 6 штук. Для 10-угольника: 10 пар, т.е. 20 штук будет. Остальной код: ссылка на изображение-карту, имя для тега <map> значение для title, если нужно, и ссылка - куда пойти при щелчке по фрагменту, остаются без изменений. Если, конечно, фрагмент можно обрисовать прямоугольником, то нужны всего-лишь две пары координат: верхнего левого угла и нижнего правого. Для окружности ещё проще: пара координат для центра окружности и значение для радиуса. Есть один маленький недостаток, изображение на страницу должно быть загружено фиксированных размеров равных реальному размеру картинки. А если размеры изображения на странице плавающие, читай, координаты плавающие - то только скрипт и подойдёт. Сообщение отредактировал EsKorTwo - Понедельник, 11 Мар 2013, 23:03:37
|
Цитата (EsKorTwo) инструменты (программы) для визуального создания навигационных карт Здесь пример создания карты с маршрутом с использованием Яндекс.Карты. |
Цитата <img src="http://.../karta/1.jpg" alt=" " align="middle" width="525px" height="575px" usemap="#map1"> <map name="map1"> <area shape="rect" coords="0,0,175,115" href="http://../karta/1-1.jpg" class="ulightbox" target="_blank" alt=" "> <area shape="rect" coords="0,115,175,230" href="http://../karta/1-2.jpg" class="ulightbox" target="_blank" alt=" "> </map> Подскажите как сделать!!! Чтобы при нажатии один раз на картинку (http://../karta/1-1.jpg), которая открывается в новом окне, она увеличивалась, а при повторном нажатии уменьшалась. Причем цент увеличения находился в области клика. |
|
Miss_Esq, по наведению не подходит.
Есть карта <img src="http://.../karta/1.jpg" alt=" " align="middle" width="525px" height="575px" usemap="#map1"> <map name="map1"> при нажатии на область карты отрывается часть карты в новом окне <area shape="rect" coords="0,0,175,115" href="http://../karta/1-1.jpg" class="ulightbox" target="_blank" alt=" "> а так как она большая, требуется увеличени при нажатии еще раз. Скинул вам в приват ссылку на страницу. |
| |||
| |||