Pranjal
Pranjal

Reputation: 463

How to put bootstrap tooltip over SVG elements in angularjs

I want try to put bootstrap tooltip over svg element in angularjs, I am not using d3.js, I simply using angularjs. If you give explanation with example that would be preferable.

Upvotes: 1

Views: 2821

Answers (2)

daniol
daniol

Reputation: 113

As AngularJS is deprecated, this is how is done in Angular using ng-bootstrap:

<svg>
<circle cx="60" cy="60" r="50" tooltip="Hello world" container="body" placement="right"/>
</svg>

Reference

Upvotes: -1

S.Klechkovski
S.Klechkovski

Reputation: 4045

The trick is just to append it to the body instead of the parent element.

I created here an example with UI Bootstrap angular directives.

<svg>
    <circle cx="60" cy="60" r="50" tooltip="Hello world" 
        tooltip-append-to-body="true" tooltip-placement="right"/>
</svg>

Upvotes: 4

Related Questions