Why won't featureClick work in my cartoDB map?

Question

I can get everything except featurecClick to work.

My JS:

window.onload = function(){
    var cartoDbTableName = 'sipri_import_export_map_1950_2014';
    var domId = 'map';
    var mapStyle = document.getElementsByClassName('map-style');
    var lat = 0;
    var lon = 0;
    var zoomLvl = 2;
    var options = {
        center: [lat,lon],
        zoom: zoomLvl
    };
    var mapObject = new L.Map(domId,options);
    var layerSource = {
        user_name: 'chrismp',
        type: 'cartodb',
        sublayers: [
            {
                sql: "SELECT * FROM "+cartoDbTableName+" WHERE (gwsyear <= 1950 AND gwsyear > 0)",
                cartocss: mapStyle[0].innerHTML
            }
        ]
    };

    L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png')
        .addTo(mapObject);

    cartodb.createLayer(mapObject,layerSource)
        .addTo(mapObject)
        .on('done',function(layer){
                layer.getSubLayer(0).on('featureClick', function(e, latlng, pos, data, subLayerIndex) {
                  console.log(e, latlng, pos, data, subLayerInde);
                }).on('error',function(err){
                    console.log('featureClick error: '+err);
                });
        }).on('error',function(err){
            console.log(err);
        });
};

My map loads with the styling, but my cursor doesn't switch to a finger-pointer when it's over a country, so nothing happens when I click it. What gives?

score 0 · Answer 1 · answered Sep 14 '15 at 17:25

I had a similar problem - I feel like CartoDB's documentation on this is a little patchy... I believe that you need to add this:

 cdb.vis.Vis.addInfowindow(map, sublayers, [/*ADD DESIRED INFO FIELDS HERE*/]);

So for example:

 cartodb.createLayer(mapObject,layerSource)
    .addTo(mapObject)
    .on('done',function(layer){

            //ADD THESE TWO LINES HERE
            sublayers = layer.getSubLayer(0);
            cdb.vis.Vis.addInfowindow(map, sublayers, [/*ADD DESIRED INFO FIELDS HERE*/]);


            layer.getSubLayer(0).on('featureClick', function(e, latlng, pos, data, subLayerIndex) {
              console.log(e, latlng, pos, data, subLayerInde);
            }).on('error',function(err){
                console.log('featureClick error: '+err);
            });
    })

Hope that helps.

Why won't featureClick work in my cartoDB map?

1 Answers1