1

UPDATE

In firefox' console I see the following error: "NetworkError: 400 Bad Request - http://1.api.cartocdn.com/tobagoborn/api/v1/map/undefined/11/677/960.png"

The script below says the layer was created and loaded but it's not being displayed. I can't see reason as to why.

Any suggestions as to what causing this issue and how to solve it?

var map;
function init(){
  // initiate leaflet map
    var map = new L.Map('map_canvas',{
        doubleClickZoom:true,zoomControl:true,scrollWheelZoom: false,touchZoom: false,dragging: true, minZoom: 11, maxZoom: 13
    }).setView(new L.LatLng(11.23,  -60.70), 6);

    var tilesUrl = 'http://tobagoborn.com/tiles/tobagobasemap/{z}/{x}/{y}.png';
    L.tileLayer(tilesUrl, {Zoom: 13}).addTo(map);

  var xxx = cartodb.createLayer(map, {
        user_name: "xxx",
        type: 'cartodb',
        sublayers: [
            {},
            {
                //table_name: 'lsites',
                sql: "SELECT * FROM lsites",
                interactivity: "landing_sites,number_of_boats,top_species,site_code"
            }]
        })
    .addTo(map)
    .on('done', function(layer) {
                console.log(layer);
        alert("CartoDB layer loaded!");
    })
            .on('error', function(err) {
                console.log(layer);
      //log the error
    });
}  

2
  • Have you checked that the layer is also in geographic coordinates or within the range set on your canvas?
    – wunderkind
    Jan 13, 2016 at 4:18
  • Everything worked when I created the app with version 1 of Cartodb library and not I am updating it to use version 3 of the library. Also, in my cartodb account, I can create a map view of what I want so the data is fine I think
    – ChrisJ
    Jan 13, 2016 at 15:33

2 Answers 2

4

Which version of the library are you using? The correct way to load the latest version of cartodb.js would be:

<link rel="stylesheet" href="http://libs.cartodb.com/cartodb.js/v3/3.15/themes/css/cartodb.css" />

< script src="http://libs.cartodb.com/cartodb.js/v3/3.15/cartodb.js"></script>

Also, you could find an example working with two sublayers with separate interactivity for each one here

1
  • That was it!! My links were bad
    – ChrisJ
    Jan 17, 2016 at 0:02
1

This works for me to show the layer:

cartodb.createLayer(map, {
    user_name: "xxx",
    type: 'cartodb',
    sublayers: [{
        sql: "SELECT * FROM lsites",
        cartocss: '#lsites {marker-fill: #FF0000;}'
    }]
}).addTo(map);

Possibly the syntax is different in the latest api?

API reference to "Creating Visualizations at Runtime"

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.