Mapbox/Leaflet Javascript : Uncaught TypeError: Cannot read property 'lat' of undefined

Question

I'm trying to build an app that build multicolored pathlines (color depending on conditions) and have them displayed on a leaflet map. The problem is the following. I have 2 functions : one that draws and one that fits the view to the draw area. When I pass my latlng array to one only, it does the job. When I pass it to both function to draw() & fitboduns() I get a "Uncaught TypeError: Cannot read property 'lat' of undefined" error... on whether : (depending on the order)

the draw() function if I bound & draw-> line with the "addTo" method.
the bound() function if I draw & bound-> line with the fitBounds method.

I've tried many thing, here's my latest code

Note : Data is a array of L.latLng : data.push(new L.latLng(test[0],test[1]));

function draw(data) {

var singlePath;
singlePath = [];

for (var i = 0; i < data.length; i++) {

  singlePath.push(data[i],data[i+1]);
  alert ("singlePath=" + singlePath);
  var firstpolyline = L.polyline(singlePath, {
    //color: pathColor[i] -> Color ARRAY 
    color : 'blue',
    weight: 8,
    opacity: 0.5,
    smoothFactor: 1

  }).addTo(leafmap);
  singlePath = [];
}

function bound(data) {
var data_bound =[];

var bounds = (new L.latLngBounds(data));

data_bound.push([bounds.getNorthEast().lat,bounds.getNorthEast().lng]);
data_bound.push([bounds.getSouthWest().lat,bounds.getSouthWest().lng]);
leafmap.fitBounds(data_bound);

}

Thank you for your help !!!

tmcw tmcw · Accepted Answer · 2015-08-23T17:14:10

for (var i = 0; i < data.length; i++) {
  singlePath.push(data[i],data[i+1]);

This loop ends at i == data.length - 1 and you reference data[i + 1], which will be undefined. Change the loop's condition to i < data.length - 1.

Mapbox/Leaflet Javascript : Uncaught TypeError: Cannot read property 'lat' of undefined

1 Answers