1

I'm trying to personalize a layer created with CartoDB. The layer is created at runtime and the problem is that I cannot make work even easy things like custom infowindow or legends or click interactions. No errors shown in the js console.

I tried with other layers (the ones used with the CartoDB tutorial) and those are working. What it's wrong with mine?

Here's the code I'm using:

function main() {
      var map;
      var urbino = new google.maps.LatLng(43.7292108173, 12.6530746836);
      var mapOptions = {
        zoom: 15,
        center: urbino,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      };
      map = new google.maps.Map(document.getElementById('map'),  mapOptions);
  cartodb.createLayer(map, {
    user_name: 'my_user',
    type: 'cartodb',
    infowindow: true,
    legends: true,
    sublayers: [{
      sql: "SELECT * FROM raw_output",
      cartocss: '#raw_output { marker-opacity: 0.9;}'
      }]
})
.addTo(map)
.on('done', function(layer) {
   var sublayer = layer.getSubLayer(0);

   sublayer.infowindow.set('template', $('#infowindow_template').html());

   sublayer.on('featureClick', function(e, pos, latlng, data) {
      alert("Hey! You clicked " + data.cartodb_id);
    });
  }).on('error', function() {
    console.log("some error occurred");
  }); 

}

Seems that using runtime layers is not that flexible as using predefined visualizations with the UI...Am I wrong?

4 Answers 4

3

It is possible to create an infowindow on a runtime visualisation.

See https://gist.github.com/javisantana/49d31ea2787a53e7ae2d

The key thing is to add the info window inside .done on cartodb.createLayer. Like this:

cartodb.createLayer(map,layerSource)
    .addTo(map)
    .done(function(layer) {
        sublayer = layer.getSubLayer(0);            
        cdb.vis.Vis.addInfowindow(map, sublayer, ['column_name']);
     })
     .error(function(err) {
         console.log("error: " + err);
     });
1

I feel it is not documented but you can do it. Here it is an example:

http://bl.ocks.org/xavijam/9269220

1
  • This worked for me.
    – abettermap
    Jul 26, 2015 at 1:54
1

I also had the same problem and figured out these two options, either place:

cdb.vis.Vis.addInfowindow(map, layer.getSubLayer(0), ['name']);

in place of:

sublayer.infowindow.set('template', $('#infowindow_template').html());

Or Use:

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

instead of

cartodb.createLayer(map, {
user_name: 'my_user',
type: 'cartodb',
infowindow: true,
legends: true,
sublayers: [{
  sql: "SELECT * FROM raw_output",
  cartocss: '#raw_output { marker-opacity: 0.9;}'
  }]}); 
-1

just found it's not possible to do it.

https://groups.google.com/forum/#!searchin/cartodb/infowindow$20/cartodb/kXgzrINV3sA/wVn_x3Dhf6QJ

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.