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

    Кому лень работать или руки не оттуда - пользуйтесь услугами специалистов
  2. Не задавайте глупых вопросов "Посоветуйте какой-нибудь компонент.."

    Есть JED!!! Ищите там!!!

Ищу Работа с интерактивными элементами (карты, схемы и тд)

Тема в разделе "Joomla", создана пользователем LDPS, 9 авг 2012.

Информация :
  • Уважаемые пользователи, прежде чем ответить в теме или создать новую, внимательно ознакомьтесь с правилами раздела
  • Не задавайте глупых вопросов "Посоветуйте какой-нибудь компонент.." Есть JED!!! Ищите там!!!
  • Аналоги ищите там же - на JED!!!
  • Новая версия? - У кого будет - тот выложит!
Статус темы:
Закрыта.
Модераторы: arman29, DMS, Genk0
  1. LDPS

    LDPS Постоялец

    Регистр.:
    29 июн 2009
    Сообщения:
    97
    Симпатии:
    7
    Друзья, ищу компонент или может расскажите как сделать при помощи скриптов на обычном html.

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

    В инете наше только вот это http://delajoom.ru/index.php/skachat-rasshirenija-web-plan
    Позволяет делать интерактивную карту... но мне не подходит из-за громоздкости. мне надо просто и лаконично.
     
  2. gres_18

    gres_18 Pythonобандерівець®

    Регистр.:
    26 апр 2009
    Сообщения:
    407
    Симпатии:
    206
    Из самых не громоздких вариантов:
    HTML:
    <center>
    <img src="img/map.jpg" width="132" height="121" border="0" usemap="#russia">
    </center>
     
    <map name="russia">
     
    <area shape="rect" coords="x1,y1,x2,y2" href="1.html" target="_blank" alt="Северо-восточная часть России">
    <area shape="rect" coords=" x1,y1,x2,y2" href="2.html" target="_blank" alt="Северо-западная часть России">
    <area shape="rect" coords=" x1,y1,x2,y2" href="3.html" target="_blank" alt="Юго-восточная часть России">
    <area shape="rect" coords=" x1,y1,x2,y2" href="4.html" target="_blank" alt="Юго-западная часть России">
     
    </map>
    Правда, это упрощенный пример. Вместо rect, очевидно, придется использовать poly с заданием координат границ визуального блока. Упростить процесс поможет Dreamweaver.
     
  3. LDPS

    LDPS Постоялец

    Регистр.:
    29 июн 2009
    Сообщения:
    97
    Симпатии:
    7
    Это совсем просто вариант, а хотелось бы сделать красиво открывающийся блок куда можно вставить не только одну строку, но и картинку и оформление текста сделать...
     
  4. puagardian

    puagardian One Love

    Moderator
    Регистр.:
    16 июл 2012
    Сообщения:
    433
    Симпатии:
    560
    Вот несколько скриптов для подобного от CodeCanyon, здесь вылаживали:

     
  5. opposite

    opposite Постоялец

    Регистр.:
    25 сен 2007
    Сообщения:
    125
    Симпатии:
    115
    LDPS, я подобную задачу решил при помощи Raphaël—JavaScript Library.
    .
    Для решения требуется векторное изображение карты, где визуальные блоки (регионы, например), разделены контурами. Берем карту в формате SVG,
    ее и настраиваем по аналогии с примером под свои нужды.
     
    Drunk Monkey нравится это.
  6. Al Maz

    Al Maz Создатель

    Регистр.:
    13 мар 2012
    Сообщения:
    17
    Симпатии:
    2
    Для реализации всплывающих подсказок есть много js-скриптов.

    Если блоки прямоугольные, проще использовать просто прозрачные div'ы.
     
  7. povelitel

    povelitel Создатель

    Регистр.:
    3 ноя 2012
    Сообщения:
    17
    Симпатии:
    1
    Это можно сделать на javascript но это очень долго, если сам будешь выверять каждый миллиметр области. Я могу посоветовать готовый вариант http://konyakov.ru/pubs/rr/ внизу есть исходный код. Дальше сделай так : во всех областях и краях РФ напиши по русски и вместо решеток поставь ссылки и тогда при нажатии на область будет открываться нужная тебе информация пример: <area href="#(http://...)" title="Belgorod Region(Белгородская область)" alt="" shape="poly" coords="38,305,38,310,42,314,46,315,47,318,48,322,48,326,49,328,54,323,55,316,54,312,51,309,47,308,41,304">
     
  8. WiZXaK

    WiZXaK Причиняю добро

    Регистр.:
    8 сен 2012
    Сообщения:
    582
    Симпатии:
    800
    А как же использование расширений goole map
     
Статус темы:
Закрыта.