Step 5 - Getting Creative (Advanced)

Although the Maptiks ID is good for preventing map/layer data fragmentation, sometimes you want to do that, and measure it. I'm talking A/B testing here.

For example, layer A has started to slow down sometime after you added two new feature layers, X and Y. Not sure which one is causing the negative interaction, you remove a layer at a time and record the map's performance at each variation. To make sure the data isn't all lumped together, you assign each variant a separate Maptiks ID, and serve them up at random to your test group.

Apart from performance, your variations can include different styles, controls, placements, or anything you can think of.

Slow Map

// all layers
var map = new L.Map('map-canvas', {
  center: [50, -100],
  zoom: 4,
  maptiks_id: 'My Leaflet Map'
});

var layerA = L.tileLayer('http://{s}.sparkgeo.com/layer-a/{z}/{x}/{y}.png',
  {maptiks_id: 'Layer A'}
).addTo(map);

var layerX = L.tileLayer('http://{s}.sparkgeo.com/layer-x/{z}/{x}/{y}.png',
  {maptiks_id: 'Layer X'}
).addTo(map);

var layerY = L.tileLayer('http://{s}.sparkgeo.com/layer-y/{z}/{x}/{y}.png',
  {maptiks_id: 'Layer Y'}
).addTo(map);

Test A

// layer Y removed
var map = new L.Map('map-canvas', {
  center: [50, -100],
  zoom: 4,
  maptiks_id: 'My Leaflet Map - Y removed'
});

var layerA = L.tileLayer('http://{s}.sparkgeo.com/layer-a/{z}/{x}/{y}.png',
  {maptiks_id: 'Layer A'}
).addTo(map);

var layerX = L.tileLayer('http://{s}.sparkgeo.com/layer-x/{z}/{x}/{y}.png',
  {maptiks_id: 'Layer X'}
).addTo(map);

Test B

// layer X removed
var map = new L.Map('map-canvas', {
  center: [50, -100],
  zoom: 4,
  maptiks_id: 'My Leaflet Map - X removed'
});

var layerA = L.tileLayer('http://{s}.sparkgeo.com/layer-a/{z}/{x}/{y}.png',
  {maptiks_id: 'Layer A'}
).addTo(map);

var layerY = L.tileLayer('http://{s}.sparkgeo.com/layer-y/{z}/{x}/{y}.png',
  {maptiks_id: 'Layer Y'}
).addTo(map);