[GIS] leaflet Uncaught TypeError: Cannot read property ‘addLayer’ of undefined

javascriptleaflet

I'm getting the following error:

 Layer.js:48 Uncaught TypeError: Cannot read property 'addLayer' of undefined
        at NewClass.addTo (Layer.js:48)
        at ResGarbGeoJ63.html:84

From this code:

var map;

        function init() {
          map = new L.map('mapid');
          map.setView([37.39,-122.086],15);

             // Add the tiled layer       
            var tiles = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {attribution: "Data copyright OpenStreetMap contributors"});
            tiles.addTo(map);

            var mondayLayer;
            var tuesdayLayer;

            var selection;
            var selectedLayer;

            // add layer

              map.on('moveend', function(e) {
                //recalculate visible points
                recalculateIncludedPoints();
              })

          }

          // Set up symbols for stops
            // Purple symbol for unselected stops
            function mondayStyle(feature) {
              return {
                fillColor:'#ff00ff',
                fillOpacity: 1,
                color: '#B04173',
              };
            }

            // Yellow symbol for unselected stops
            function mondaySelectedStyle(feature) {
              return {
                fillColor: "00FFFB",
                color: '#0000FF',
                fillOpacity: 1
              };
            }

            // handle click events on the garden features
            function garbageOnEachFeature(feature, layer){
              layer.on({
                click: function(e) {
                    if (e.target.feature) {
                      //this scope will run whenever the clicked target is a valid marker point           
                      resetStyles();
                    }

                    //set this style
                    e.target.setStyle(mondaySelectedStyle());
                    selection = e.target;
                    selectedLayer = mondayLayer;

                    // Insert some HTML with the feature name
                    buildSummaryLabel(feature);

                    L.DomEvent.stopPropagation(e); // stop click from being further propagated
                  }
                });
              }

              var mondayLayer = new L.geoJSON(mondayData, {
              style: mondayStyle,
              onEachFeature: garbageOnEachFeature
            });

            mondayLayer.addTo(map);
            tuesdayLayer.addTo(map);

I move the var from the var mondayLayer = new L.geoJSO… but to no avail

Best Answer

Either use new with the class (UPPER case first letter):

map = new L.Map('mapid');
var mondayLayer = new L.GeoJSON()

OR use the factory (lower case first letter):

map = L.map('mapid');
var mondayLayer = L.geoJSON()
Related Question