1

We are using Google MAP API V3 and CartoDB. I am trying to create the custom info box window as user clicked on CartoDB points marker. We have two layers on Google map first one for UK wide ward area polygon layer and other one is represent to the homes in each ward area by points marker on the ward layer and both the layers has individual feature click events(i.e. ward area polygon zoomed in on click and points marker will show the info box on click). But whenever I click on the points marker ward area layer which is behind that points marker also trigger feature click event with that. So I just want to trigger the points marker feature click events to show info box when user clicked on that.

function drawWardOnMap() {

var sqlWhere;
cartodb.createLayer(map, {
        user_name: username,
        type: 'cartodb',
         sublayers:[{
            sql: "SELECT * from table",
            cartocss: $('#ward_heatmap_index').html().format('units'),
            interactivity: "units, cartodb_id, the_geom_webmercator, wd13nm, wd11cd, govtid, localarea, geometry "
        }]              
})
.addTo(map)
.done(function (layer) {

    layer.setInteraction(true);
    GLOBAL_WARDS_HEATMAP_LAYER = layer;
    layer.getSubLayer(0).on('mouseover', function(e, latlng, pos, data, layerIndex) {
    });

    layer.on('featureClick', function(e, latlng, pos, data, layerIndex) {

        if(layerIndex == 1 ) {

            getUnitDetailsInfoBoxStats(data, "yes-show-it");
            return;

        } else if(layerIndex == 0 ) {

            getPointsOnMap();
        }

    });

    layer.getSubLayer(0).on('featureOut', function(e, pos, latlng, data, layerIndex) {
    });



})
.error(function (){
    console.log('problem adding 2nd layer');
});

}

function getPointsOnMap() {

var _numSublayers = GLOBAL_WARDS_HEATMAP_LAYER.getSubLayerCount();
console.log("_numSublayers: " + _numSublayers);
if( _numSublayers == 1 ) {

    GLOBAL_WARDS_HEATMAP_LAYER.createSubLayer({

    sql: _SQLString,
    cartocss: _CartoCss,                    
    interactivity: "rslid, non_pi_name, lrdid, lat, lang, postcode, district_name, unit_type_desc, wd11cd, wd13nm, govtid, localarea, ward_centroid_lat, ward_centroid_lang, total_mile_s_count"

    })
    GLOBAL_WARDS_HEATMAP_LAYER.getSubLayer(1).setInteraction(true);

} else if( _numSublayers == 2 ) {

    var _subLayer = GLOBAL_WARDS_HEATMAP_LAYER.getSubLayer(1);
    _subLayer.setSQL(_SQLString);
    _subLayer.setCartoCSS(_CartoCss);           
    _subLayer.setInteractivity('rslid, non_pi_name, lrdid, lat, lang, postcode, district_name, unit_type_desc, wd11cd, wd13nm, govtid, localarea, ward_centroid_lat, ward_centroid_lang, total_mile_s_count');
    _subLayer.setInteraction(true);
}

}

  • My guess (since you are not showing any code) is that you are not stopping the click event propagation. – Javier Dec 15 '14 at 14:07
2

You didn't mentioned how you're initiating the ward area polygon layer. Let's assume, if you're using cartodb.createlayer function, setting up infowindow:false hides the infowindow for this layer

cartodb.createLayer(map, 'url_to_polygon_layer', {infowindow:false}).addTo(map)

Same way if you're using cartodb.createVis, passing infowindow:false would hide the infowindow. Hope this helps you. If there is another case, edit your question or comment below.

Edited add infowindow:false as shown below

cartodb.createLayer(map, {
    user_name: username,
    type: 'cartodb',
    infowindow: false,
     sublayers:[{
        sql: "SELECT * from table",
        cartocss: $('#ward_heatmap_index').html().format('units'),
        interactivity: "units, cartodb_id, the_geom_webmercator, wd13nm, wd11cd, govtid, localarea, geometry "
    }]              

})

  • Thanks Muzaffar, I have edit the question with code. Please put some light on that now. – Nil Dec 16 '14 at 8:20
  • I've updated the question, see if it helps you. – muzaffar Dec 17 '14 at 15:16

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.