SVG Tooltip Issue

Question

I have a project built with asp.net, c#. and using embeded object in HTML to show SVG files.

I have a request to show tool-tip over SVG elements. SVG is a separate file and having the content in XML. This file is basically generated after converting from Visio file.

Now I have to show some dynamic content in tool-tip over different SVG elements.

I have added a separate rect and text element and hide it in SVG element and on mouse over of any SVG element I am making the tool-tip visible. Its working up to this point.

Now I have to set the position of tool-tip which is bit tricky if I need to calculate position on the basis of target group element.

If I populate tool-tip over mouse position then tool-tip get dragged with mouse position which looks bad. so I want to populate tool-tip over target element position.

Please help me to set tool-tip position over target element!

Why not just give the rect a `` child element with the tooltip text. That's native tooltips and is surely much easier. — Robert Longson, Dec 18 '14 at 09:19
What if I want to style the title element. will it be possible? — mercury, Dec 18 '14 at 09:59

score 0 · Accepted Answer · edited May 23 '17 at 12:12

0

Found the solution over below URL: How to determine size of Raphael object after scaling & rotating it?

used get_metrics function to calculate the required position to show tooltip.

Thanks a lot!

edited May 23 '17 at 12:12

Community

1
1

answered Jan 30 '15 at 09:19

mercury

227
4
13

SVG Tooltip Issue

1 Answers1