Create a layer selector when making a map at runtime for CartoDB

Question

Using the same theory to create a search box at runtime, (such as here), I wrote this code:

var l = cdb.vis.Overlay.create('layer_selector', map.viz, {})
l.show();
$('#map').append(l.render().el);

But this doesn't work as anticipated. The layer selector doesn't fill with any layers. It tells me I have 0 layers.

Can someone tell me how to get a layer selector at runtime, using the cartodb layer selector?

EDIT: I've taken the bits of my code related to this:

function main() {
var map = new L.Map('map', {
    zoomControl: false,
    center: [40.7142, -74.0064],
    zoom: 11
});
L.tileLayer('http://tile.stamen.com/toner/{z}/{x}/{y}.png', {
    attribution: 'Stamen'
}).addTo(map);

cartodb.createLayer(map, {
    type: 'cartodb',
    options: {
        user_name: '',
        table_name: '',
        extra_params: {
            map_key: ''
        }
    },
    sublayers: [{
        sql: "SELECT * FROM roads",
        cartocss: '#roads{line-color: #FF6600;line-width: 2;line-opacity: 0.7;}'
    }]
})
    .addTo(map)
    .on('done', function (vis,layer) {

    var l = cdb.vis.Overlay.create('layer_selector', map.vis, {
        layer_selector: true
    })
    l.show();
    $('#map').append(l.render().el);

}).on('error', function () {
    console.log("some error occurred");
});
}

Answer 1

You were doing it basically right, check this full example:

http://bl.ocks.org/javierarce/50244a6a7a8a4e1a959a

Answer 2

There are examples in the official documentation, here and code here.

I don't use their API, though, so someone else might have a specific example.

Try something like this:

var l = cdb.vis.Overlay.create('layer_selector', map.viz, {layer_selector: true})

I think it's just an option to set, which by default is 'off' for layer_selector. See here. "layer_selector: show layer selector (default: false)"