0

I've got 2 layers being rendered separately with this:

var layerSource = {
        user_name: 'jonmrich',
        type: 'cartodb',
        sublayers: [{
            sql: "SELECT * FROM " + carto_table + " WHERE type = 'red_blank'",
            cartocss: '#location_fusion_table {marker-file: url(https://s3.amazonaws.com/com.cartodb.users-assets.production/production/jonmrich/assets/20150203194453red_pin.png);marker-width:25;marker-allow-overlap: true;}'
        }, {
            sql: "SELECT * FROM " + carto_table + " WHERE type = 'small_blue'",
            cartocss: '#location_fusion_table {marker-fill:#1d5492;marker-width:5;marker-line-width: 0.5;marker-line-color:#fff;marker-allow-overlap: true;}'
        }]
    };

and later:

cartodb.createLayer(map_object, layerSource, options)
        .addTo(map_object)

Here's what ends up happening:

enter image description here

What I'd like to have is where the red pins ALWAYS show on top of the blue circles. If I turn overlap to false, I lose a lot of detail, but the blue circles aren't on top of my red pins. Is there some sort of "z-index" or "bring to front" that I can employ here?

2

You can also use the Leaflet function setZIndex, although reordering the addition of the layers also work.

For example:

      cartodb.createLayer(map, {
      user_name: 'username',
      type: 'cartodb',
      sublayers: [{
         sql: baseSqlA,
         cartocss: cartocss
      }]
    })
    .addTo(map)
    .done(function(layer) {
          layer.setZIndex(1);

    });

    cartodb.createLayer(map, {
      user_name: 'username',
      type: 'cartodb',
     sublayers: [{
         sql: baseSqlB,
         cartocss:cartocss
      }]
    })
    .addTo(map)
    .done(function(layer) {
      layer.setZIndex(0);
    });
0

Solved this myself...

I just swapped the order in which I'm rendering the sublayers. The second one always ends up on top.

enter image description here

It also seems that both layers need marker-allow-overlap: true;

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.