Изменить атрибут title объектов raphael

Question

Я работаю с raphael.js для рисования, и я хочу изменить атрибут title (изменить цвет, размер шрифта и т. Д.).

circle.attr({ 
    title: 'This is a circle.', 
    fill: 'red' 
}); 

Это мой jsfiddle.

Есть ли способ сделать это? Или, может быть, добавить специальные всплывающие подсказки к объектам raphael? Редактировать: Вот ожидаемая модификация: я хочу напечатать «Hello World» на моей подсказке. «Привет» в красном, затем «новая линия» персонаж и, наконец, «Мир» в синем цвете.

Это не работает, но может помочь получить представление о том, что я пытаюсь сделать.

circle.attr({ 
    title:"<font color="red">Hello</font><br><font color="blue">World!</font>" 
}); 

Answer 1

Рафаэль не имеет сокращенные функции для этого, но вы можете легко изменить визуализированная элементы SVG путем простой DOM манипуляции:

circle.node.onmouseover = function() { 
    this.style.cursor = 'pointer' 
    this.querySelector('title').textContent = 'This is a new title'; 
} 

раздвоенный (теперь на самом деле работает) скрипку ->http://jsfiddle.net/nheL8add/

---

Update: теперь я понимаю, что у ou на самом деле спрашивают: «ли атрибут заголовка элемента HTML поддерживает HTML?» (Я полностью фокусировался на изменении элемента title, а не на части «Редактирование»). Ответ - нет. Атрибут title элемента circle полностью совпадает с любым другим атрибутом title во всех других элементах HTML. Но вы можете использовать скрипт всплывающей подсказки, например qTip2 или похожий, чтобы получить желаемый эффект. Я рекомендую qtip2, так как он поддерживает <SVG> элементов. Пропустить атрибут заголовка на самой окружности элементе и использовать qTip2 вместо:

$("#canvas circle").qtip({ 
    style: { classes: 'tooltip' }, 
    content: { text: '<font color="red">Hello</font><br><font color="blue">World!</font>' }, 
    position:{ my:'center center', at:'center center' },  
    show: 'mousemove mouseenter mouseover'  
}); 

еще один раздвоенной скрипка ->http://jsfiddle.net/ajLnhete/