D3 Examples - Multiple tooltips at a time

xxxxxxxxxx
 
<!DOCTYPE html>
<html>
<head>
  <script src='https://api.tiles.mapbox.com/mapbox.js/v0.6.6/mapbox.js'></script>
  <link href='https://api.tiles.mapbox.com/mapbox.js/v0.6.6/mapbox.css' rel='stylesheet' />
  <script src='multitooltip.js'></script>
  <style>
    body { margin:0; padding:0; }
    #map { position:absolute; top:0; bottom:0; width:100%; }
    .tooltip-container {
        position:absolute;
        top:10px;
        right:10px;
    }
    .tooltip-container .map-tooltip {
        position:relative;
    }
  </style>
</head>
<body>
<div id='map'></div>
<script>
    // If you're creating a new interactive layer, follow the tooltips docs:
    // https://mapbox.com/tilemill/docs/crashcourse/tooltips/
    mapbox.load('tmcw.map-1318710776640', function(o) {
        var map = mapbox.map('map');
        map.ui.hash.add();
        map.addLayer(o.layer).zoom(8).center({ lat: 36.9, lon: -78.68 });
        map.interaction.auto();
        map.interaction.off();
        map.interaction.on(multitooltip().parent(map.parent).events());
​
​
        // Attribute map
        map.ui.attribution.add()
            .content('<a href="https://mapbox.com/about/maps">Terms &amp; Feedback</a>');
    });
</script>
</body>
</html>
​
    