I am trying to add the layer control (L.control.layers) to an application using cartodb.js (v. 3.14).
The last line in the following code
L.control.layers(basemaps).addTo(map);breaks the entire thing.
If I comment it out the point data will be shown, as expected, on top of the black basemap:
But I would like to have two basemaps and I would like to have my points as an overlay. So I group them into the respective objects and then pass these objects to the layer control.
What happens then is that I can still toggle both my basemaps, and the dataset is briefly displayed when doing so. However, if I click on the overlay button:
I get (first time):
Here is the entire code:
var map;$( document ).ready(function() { map = new L.Map('mapDIV', { center: [52.51601,13.40538], zoom: 12 }) var layerUrl = 'https://PATH/viz.json'; cartoDB_lyr = cartodb.createLayer(map, layerUrl) cartoDB_lyr.addTo(map); var osm = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {minZoom: 8, maxZoom: 12, attribution: 'Map data © OpenStreetMap contributors'}); osm.addTo(map); var mapBoxBlack = new L.tileLayer('https://dnv9my2eseobd.cloudfront.net/v3/cartodb.map-4xtxp73f/{z}/{x}/{y}.png', { attribution: 'Mapbox Terms & Feedback' }) mapBoxBlack.addTo(map); var basemaps = { 'OSM'
sm, 'Mapbox Black': mapBoxBlack } var overlays = { 'Berlin Points':cartoDB_lyr } L.control.layers(basemaps, overlays).addTo(map); });
أكثر...
The last line in the following code
L.control.layers(basemaps).addTo(map);breaks the entire thing.
If I comment it out the point data will be shown, as expected, on top of the black basemap:
But I would like to have two basemaps and I would like to have my points as an overlay. So I group them into the respective objects and then pass these objects to the layer control.
What happens then is that I can still toggle both my basemaps, and the dataset is briefly displayed when doing so. However, if I click on the overlay button:
I get (first time):
Uncaught TypeError: a.onAdd is not a function
or (subsequent times):
Uncaught TypeError: a.onRemove is not a function
Here is the entire code:
var map;$( document ).ready(function() { map = new L.Map('mapDIV', { center: [52.51601,13.40538], zoom: 12 }) var layerUrl = 'https://PATH/viz.json'; cartoDB_lyr = cartodb.createLayer(map, layerUrl) cartoDB_lyr.addTo(map); var osm = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {minZoom: 8, maxZoom: 12, attribution: 'Map data © OpenStreetMap contributors'}); osm.addTo(map); var mapBoxBlack = new L.tileLayer('https://dnv9my2eseobd.cloudfront.net/v3/cartodb.map-4xtxp73f/{z}/{x}/{y}.png', { attribution: 'Mapbox Terms & Feedback' }) mapBoxBlack.addTo(map); var basemaps = { 'OSM'
sm, 'Mapbox Black': mapBoxBlack } var overlays = { 'Berlin Points':cartoDB_lyr } L.control.layers(basemaps, overlays).addTo(map); }); أكثر...