Как добавить маркер к «бумаге» Рафаэля в javascript?

Мне нужен маркер, который ведет себя так же, как добавление маркера на карту. При двойном щелчке маркер отображается в точке, по которой щелкнули, и возвращает координаты x/y пикселей точки, по которой щелкнули.

У меня есть бумага Рафаэля:

var R = Raphael("paper", 500, 500);

с путями (R.path("M 92.3456 ... 37.0934 Z")) на нем, которые определяют формы. И я должен быть бел, чтобы добавить маркеры на эту бумагу с формами.

Я не программист javascript, поэтому даже не знаю, с чего начать. Так что любая помощь здесь очень ценится!


javascript html jquery double-click raphael
person Marta    schedule 21.12.2011    source источник
comment
Вы не нашли ответ полезным? Удалось ли вам использовать его со своими формами? До свидания!   -  person limoragni    schedule 27.12.2011
comment
Да, я использовал эту функцию. Но вместо формы я использовал .image   -  person Marta    schedule 28.12.2011

Ответы (1)


arrow_upward
1
arrow_downward

Хорошо, я сделал эту простую скрипку, чтобы помочь вам с вашей проблемой.

http://jsfiddle.net/mN5du/1/

Я просто добавляю событие двойного клика Raphael в круг (вы можете сделать то же самое со своими путями). Когда это событие запускается, сохраняет координаты мыши в двух переменных. Затем я просто использую эти две переменные, чтобы нарисовать новый круг. Если вы хотите нарисовать путь вместо круга, вам просто нужно использовать переменные в координатах пути.

Я надеюсь, что это работает для вас! Если у вас есть какие-либо вопросы, просто скажите мне! до свидания!

Редактировать: Посмотрите на комментарий ниже, это хороший вклад в ответ!

Edit2: Строка console.log(x,y) предназначена для печати значений мыши в консоли браузера, для работы кода это необязательно.

person limoragni    schedule 23.12.2011
comment
Возможно, вы захотите использовать фреймворк (например, jquery), чтобы сделать ваш скрипт кроссбраузерным, как показано здесь - ваш пример работает в IE, но не в firefox - person Mike C; 24.12.2011
comment
Да ты прав. Fiddle просто иллюстрирует, как вы можете добиться размещения маркеров с помощью raphael и JS. Спасибо за исправление, я думаю, что это будет полезно для завершения ответа. - person limoragni; 24.12.2011