Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 11.04.2014, 02:21
Новичок на форуме
Отправить личное сообщение для kolum Посмотреть профиль Найти все сообщения от kolum
 
Регистрация: 11.04.2014
Сообщений: 2

Создание интерактивной схемы
Доброго времени.
Поставили мне такую задачу: есть схема складских мест, разбросанных по территории(рисунок), надо сделать так, чтобы при открытии страницы было видно, какие из низ заняты, какие свободны (обозначить их разными цветами, например), а при клике на место всплывало окно с данными (какой груз и его количество). Все данные хранятся в БД(Oracle). Попробовал реализовать все при помощи Raphael и jquery, доступ к БД посредством PHP, но получается как-то громоздко и сложно (в js я вобще чайник).
Возникла идея, размещать на схеме иконки, и кликая по ним, получать результаты, в связи с этим вопросы:

1. Как разместить кликабельную картинку в определенных координатах?
2. Как сделать, чтобы при клике на картинку сработал мой скрипт на php, вернул данные из БД и они отобразились во всплывающем окне? (данные буду возвращать через ajax/POST).

Сумбур вобщем какой-то написал

Еще есть вопросик небольшой в ту же тему. Возможно ли присвоить этому изображению обработчик по клику?
echo "<img src=\"img/place1.gif\" style=\"position:absolute; top:".$top."px; left:".$left."px;\">";


Спасибо.

Последний раз редактировалось kolum, 11.04.2014 в 02:24.
Ответить с цитированием
  #2 (permalink)  
Старый 11.04.2014, 03:19
Новичок на форуме
Отправить личное сообщение для kolum Посмотреть профиль Найти все сообщения от kolum
 
Регистрация: 11.04.2014
Сообщений: 2

Вот примерно то, что надо сделать:
http://dynmap.ruslotro.com/
Ответить с цитированием
  #3 (permalink)  
Старый 11.04.2014, 05:51
Профессор
Отправить личное сообщение для jsnb Посмотреть профиль Найти все сообщения от jsnb
 
Регистрация: 15.03.2014
Сообщений: 561

Сообщение от kolum Посмотреть сообщение
Как разместить кликабельную картинку в определенных координатах?
В CSS задать position: absolute и можно двигать как угодно меняя CSS свойства left и top. Если задать у родительского элемента position:relative, то left и top будут относительно родительского элемента.

Сообщение от kolum Посмотреть сообщение
Как сделать, чтобы при клике на картинку сработал мой скрипт на php, вернул данные из БД и они отобразились во всплывающем окне? (данные буду возвращать через ajax/POST).
Ну, вешаешь на клик обработчик, который шлет ajax GET/POST запрос с нужными данными на сервер (скрипт), сервер на основании полученных данных делает SQL запрос к базе, получает выборку, и формирует на основании нее ответ в виде того же JSON и ответом на клиентский запрос. Клиент получает ответ и отображает нужные данные как ему надо.

Про события написано тут: http://learn.javascript.ru/events-and-interfaces
Про ajax тут: http://learn.javascript.ru/ajax
Если используется jQuery гуглить методы .ajax/.post/.get

Последний раз редактировалось jsnb, 11.04.2014 в 05:55.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Создание своей библиотеки. Создание двух одинаковых объектов. Как избежать? IDCh Javascript под браузер 2 31.10.2012 12:53
Блок схемы на JS Rionty Элементы интерфейса 0 27.11.2011 20:02
Создание скрипта "Итеррационные циклы" по формуле krasopetka Общие вопросы Javascript 0 17.11.2011 12:42
Создание интерактивной карты Veligur Элементы интерфейса 3 24.08.2010 23:28
Создание скрипта! Создание диктанта для учеников! Елизавета Работа 10 30.06.2010 21:00