bootstrap tooltips

by Ryan

HTML

<script src="http://d3js.org/d3.v2.js"></script>
<script src="http://prag.ma/code/d3-bootstrap/d3-compat.js"></script>
<script src="http://prag.ma/code/d3-bootstrap/bootstrap-tooltip.js"></script>
<link rel="stylesheet" href="http://prag.ma/code/d3-bootstrap/css/bootstrap.css">
<div class="container">
    <h1>tooltips</h1>
    <p>This
        <a class="tt" data-placement="bottom" title="the word paragraph">paragraph</a>
        should have some
        <a class="tt" data-placement="top" data-html="true" title="the word &lt;tooltip&gt;">tooltips</a>
        in it. You can put them
        <a class="tt" data-placement="left" title="look over here!">on the left</a>
        or 
        <a class="tt" data-placement="right" title="look over there!">on the right</a>, too.
    </p>
</div>

JavaScript

var tooltip = bootstrap.tooltip()
    .placement(function() {
        return this.getAttribute("data-placement");
    });

d3.selectAll("a.tt")
    .call(tooltip);