Cartodb.js tooltip on a viz

Question

I am having a hard time implementing a UI tooltip in a CartoDB.js viz. Could someone demonstrate how to implement using this fiddle on the variable {{NAME}}?

Answer 1

it's pretty easy:

 cartodb.createLayer(map, 'http://documentation.cartodb.com/api/v2/viz/2b13c956-e7c1-11e2-806b-5404a6a683d5/viz.json').addTo(map)
   .done(function(layer) {

      var sublayer = layer.getSubLayer(0);
      sublayer.set({ 'interactivity': ['cartodb_id', 'name'] });

      var i = new cdb.geo.ui.InfoBox({
          layer: layer,
          template: '<h3>{{name}}</h3><p>more info</p>',
          width: 200,
          position: 'bottom|right'
      });
      $('body').append(i.render().el);

  });

I'd recomend you to take a look to The Hobbit example: https://github.com/CartoDB/cartodb.js/blob/develop/examples/TheHobbitLocations/js/app.js