0

I'm doing a test map with two tables, one with polygons and the other with points. I create a layer with two sublayers (polygons and points).

The user selects a state and the query is updated showing the selected state and the points contained therein.

I have a code that works with public tables, but when I try to use the api-key (as seem on here) I get an Error 503 backend read error when the query updates

This is my code for createLayer:

   cartodb.createLayer(map, {
    user_name:user,
    type: 'cartodb',
    sublayers:[subLayer0Options, subLayer1Options],
    options: {
      table_name: point_table,
      user_name: user,
      extra_params: {
        map_key: key
      }
    }
  })
  .done(function(layer) {
    layer.options.extra_params.map_key = key;
    layer.addTo(map);
    layer.setInteraction(true);
    updateMap(layer);
  })

The updateMap() function:

 function updateMap(layer){
    layer.setInteraction(true)

    // change the query for the sublayer(0) == polygons
    var myquery0= "SELECT b.* FROM usa_states b, point_table s WHERE b.state = '"+state+"' AND st_intersects(b.the_geom_webmercator, s.the_geom_webmercator)"
    var subLayer0Options = {
      sql: myquery0,
      cartocss: "#usa_states {polygon-fill: #0f3b82;}"
    }
    var states = layer.getSubLayer(0)
    states.set(subLayer0Options);
    //states.setInteraction(false);      

    // change query of the sublayer(1) == points
    var myquery1= "SELECT s.* FROM usa_states b, points_table s WHERE b.state = '"+state +"' AND st_intersects(b.the_geom_webmercator, s.the_geom_webmercator)"

    var subLayer1Options = {
      sql: myquery1,
      cartocss: "#point_table{marker-fill: #FFCC00;}",
      interactivity: 'cartodb_id, column1, column2, column3',
      infowindow: true 
    }
    var points = layer.getSubLayer(1)
    points.set(subLayer1Options);
    points.setInteraction(true)
    points.infowindow.set('template', $('#infowindow_template').html());
    //cdb.vis.Vis.addInfowindow(map, points, ['cartodb_id, column1, column2, column3'])

    var sql = new cartodb.SQL({ user: user, api_key: key});
    sql.getBounds(myquery1).done(function(bounds) {
        map.fitBounds(bounds)
    });
  })
};

Use the apikey on the client is only for local testing, I read something about how the maps with private tables now must use "template maps".

Edit:

I'm trying to do a template.json file but I don't know how to put two sublayers in the layergroup:

"layergroup": {
   // see https://github.com/CartoDB/Windshaft/wiki/MapConfig-specification
   "version": "1.0.1",
   // Array of layers defined in render order
   "layers": [{ 
     "type": "cartodb",
     "options": {
       "cartocss_version": "2.1.1", 
       "cartocss": "#layer { polygon-fill: <%= color %>; }",
       "sql": "SELECT s.* FROM usa_states b, points_table s WHERE b.state = <%= state %> AND st_intersects(b.the_geom_webmercator, s.the_geom_webmercator)",
       "affected_tables": [ "usa_states", "points_table" ],
       "interactivity": [ "cartodb_id", "field1", "field2", "field3", "field4"]
     }
   }]
 } 
1

First of all, you should never ever use api_key in frontend code.

In order to add more than one layer you can do this:

"layergroup": {
   // see https://github.com/CartoDB/Windshaft/wiki/MapConfig-specification
   "version": "1.0.1",
   // Array of layers defined in render order
   "layers": [{ 
     "type": "cartodb",
     "options": {
       "cartocss_version": "2.1.1", 
       "cartocss": "#layer { polygon-fill: <%= color %>; }",
       "sql": "SELECT s.* FROM usa_states b, points_table s WHERE b.state = <%= state %> AND st_intersects(b.the_geom_webmercator, s.the_geom_webmercator)",
       "interactivity": [ "cartodb_id", "field1", "field2", "field3", "field4"]
     }
   },{ 
     "type": "cartodb",
     "options": {
       "cartocss_version": "2.1.1", 
       "cartocss": "#layer { polygon-fill: red; }",
       "sql": "SELECT * form table 2",
       "interactivity": [ "cartodb_id"]
     }
   }
  ]
 }

You don't need to specify affected_tables, backend does it for you

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.