Как разрешить вводить текст в объект Рафаэля, скажем rect?


Я создал прямую кишку Рафаэля, как показано ниже: var rect1 = paper.rect(100,100,100,100)

Теперь я хочу, чтобы при нажатии на rect появлялся курсор и пользователю разрешалось вводить / key в некоторый текст

Я очень, очень новичок в JS и Рафаэле.

1 2

1 ответ:

Это не естественное использование Рафаэля. Думайте о нем прежде всего как о библиотеке рисунков. Если вы посмотрите спецификации SVG или любую из демонстраций на странице RaphaelJS, вы получите идею.

Но Рафаэль естественным образом интегрируется с собственным Javascript или jQuery. Я бы поместил текстовую область без полей поверх вашего прямоугольника и активировал (и сфокусировал) ее, когда пользователь нажимает на пробел, например:
var paper = Raphael("canvas", 300, 300),
    rect1 = paper.rect(100,100,100,100).attr({fill: "#FFF"});

rect1.click(function(e) {
   $('#text').show(); 
   $('#text').focus(); 
});
​

Http://jsfiddle.net/NtKKZ/

(Примечание что вам нужно заполнить прямоугольник белым цветом, чтобы событие click сработало.)