D3 Examples - Click interaction

xxxxxxxxxx
 
<!DOCTYPE html>
<html>
<head>
  <script src='https://api.tiles.mapbox.com/mapbox.js/v0.6.4/mapbox.js'></script>
  <link href='https://api.tiles.mapbox.com/mapbox.js/v0.6.4/mapbox.css' rel='stylesheet' />
  <style>
    body { margin:0; padding:0; }
    #map { position:absolute; top:0; bottom:0; width:100%; }
  </style>
</head>
<body>
<div id='map'></div>
<script>
  var m = mapbox.map('map');
  m.addLayer(mapbox.layer().id('examples.map-20v6611k'));
​
  // Create an empty markers layer
  var markerLayer = mapbox.markers.layer();
​
  // Add interaction to this marker layer. This
  // binds tooltips to each marker that has title
  // and description defined.
  m.addLayer(markerLayer);
​
  var interaction = mapbox.markers.interaction(markerLayer)
    .showOnHover(false);
  m.addCallback('panned', function() { interaction.hideTooltips(); });
​
  m.zoom(5).center({ lat: 37, lon: -77 });
​
  // Add a single feature to the markers layer.
  // You can use .features() to add multiple features.
  markerLayer.add_feature({
      geometry: {
          coordinates: [-77, 37.9]
      },
      properties: {
          'marker-color': '#000',
          'marker-symbol': 'star-stroked',
          title: 'Example Marker',
          description: 'This is a single marker.'
      }
  });
</script>
</body>
</html>
​
    