¿Cómo filtrar dos capas del mapa con un botón en CartoDB?

Question

Estoy trabajando en un proyecto de cartografía en el que quiero que el usuario final pueda filtrar los datos. Este tutorial ( http://docs.cartodb.com/tutorials/toggle_map_view.html ) me dio una forma de hacerlo, de manera que el usuario final pueda filtrar efectivamente haciendo clic en los botones. Donde estoy ahora atascado es que mi mapa tiene dos capas (una para puntos, otra para líneas), y quiero que el botón se aplique a ambas capas en lugar de sólo una. ¿Qué partes del código tengo que cambiar para que esto suceda, y qué cambios tengo que hacer?

La parte que estoy mirando en particular del tutorial es:

var sublayers = [];

  cartodb.createLayer(map, layerUrl)
  .addTo(map)
  .on('done', function(layer) {
    // change the query for the first layer
    var subLayerOptions = {
      sql: "SELECT * FROM ne_10m_populated_places_simple",
      cartocss: "#ne_10m_populated_places_simple{marker-fill: #F84F40; marker-width: 8; marker-line-color: white; marker-line-width: 2; marker-clip: false; marker-allow-overlap: true;}"
    }

    var sublayer = layer.getSubLayer(0);

    sublayer.set(subLayerOptions);

    sublayers.push(sublayer);
  }).on('error', function() {
    //log the error
  });

  //we define the queries that will be performed when we click on the buttons, by modifying the SQL of our layer
  var LayerActions = {
    all: function(){
      sublayers[0].setSQL("SELECT * FROM ne_10m_populated_places_simple");
      return true;
    },
    capitals: function(){
      sublayers[0].setSQL("SELECT * FROM ne_10m_populated_places_simple WHERE featurecla = 'Admin-0 capital'");
      return true;
    },
    megacities: function() {
      sublayers[0].set({
        sql: "SELECT * FROM ne_10m_populated_places_simple WHERE megacity = 1",
        //as it is said, you can also add some CartoCSS code to make your points look like you want for the different queries
       // cartocss: "#ne_10m_populated_places_simple{ marker-fill: black; }"
      });
      return true;
    }
  }

Edición: En este momento parece que podría lograr esto haciendo que las funciones de los botones realicen dos acciones (es decir, seleccionar x de una tabla, seleccionar x de la otra tabla). ¿Es esto posible? Si es así, ¿cómo?

Answer 1

No sé si es la mejor manera de resolver este problema, pero he conseguido que funcione volviendo a CartoDB y haciendo dos mapas separados en lugar de tener un mapa con dos capas. (Estaba teniendo problemas con los puntos y las líneas que aparecen dos veces y parcialmente filtrados, etc.) Dupliqué la primera mitad (es decir, varlayerURL -> registrar el error) y añadí "2" en todas partes:

  var layer2Url = 'https://myusername.cartodb.com/ap/blahblahblah';

  var sublayers2 = [];

      cartodb.createLayer(map, layer2Url)
      .addTo(map)
      .on('done', function(layer) {

      var subLayer2Options = {
    sql: "SELECT * FROM my_map_name",
    cartocss: "#my_map_name{marker-fill-opacity: 0.9; marker-line-color: #FFF; marker-line-width: 1; marker-line-opacity: 1; marker-placement: point; marker-type: ellipse; marker-width: 10; marker-fill: #F11810; marker-allow-overlap: true;}"
  }

  var sublayer2 = layer.getSubLayer(0);

  sublayer2.set(subLayer2Options);

      sublayers.push(sublayer2);
      }).on('error', function() {
          //log the error
});

Luego he modificado la segunda mitad cambiando esto:

  var LayerActions = {
    all: function(){
      sublayers[0].setSQL("SELECT * FROM ne_10m_populated_places_simple");
      return true;
    },

a

  var LayerActions = {
    all: function(){
      sublayers[0].setSQL("SELECT * FROM ne_10m_populated_places_simple");
      sublayers[1].setSQL("SELECT * FROM next_layer_name");
      return true;
    },