Leaflet how to combine icons and circle markers in the same layergroup

Question

I have a bunch of coordinates to add onto a Leaflet map. Coordinates tagged with the value "home" will get a home-like svg icon and get stored in the homeIcons variable. All other coordinates will get a circular marker and get stored in variable called circles . My current approach only succeeds in turning circles into a proper leaflet object but not the homeIcons . So by the time I combine them into a layer group using L.layerGroup() , objects from 'homeIcons' simply get dropped out. Please let me know if you see where the problem with my code is. Thank you!

    var circles = [];
    var homeIcons = [];

    var markerOptions = {
      radius      : 10,
      fillColor   : 'yellow',
      color       : 'null',
      weight      : 1,
      opacity     : 1,
      fillOpacity : 0.8
    };

    var homeIcon = L.icon({
      iconUrl: 'public/imgs/home_icon.svg',
      iconSize     : [30, 30],
      iconAnchor   : [8, 18],
      popupAnchor  : [0, -15],
    });

    var homeMarker = L.marker([null, null], {icon: homeIcon, opacity: 1});

    for (var i=0; i<data.length; i++) {
      var pois = JSON.parse(data[i].POIs);

      for (var n=0; n<pois.length; n++) {
        homeMarker = {latlng:[pois[n].lat, pois[n].lng], name: data[i].Name}; 

        if (pois[n].poiTag == "home") {
        homeIcons.push(L.marker(homeMarker));
        } else {
        circles.push(L.circleMarker([pois[n].lat, pois[n].lng], markerOptions, {name: data[i].Name}));
        }
      }
    }

    console.log(circles);    // Outputs an array of leaflet objects
    console.log(homeIcons);  // Not outputing an array of objects with similar properties as leaflet objects

    var allLayers = L.layerGroup(circles, homeIcons);  // this is supposed to add both circles to homeIcons to the layergroup

    console.log(allLayers);  // By here, all the homeIcons have disappeared.

    cb(allLayers);

  }

Answer 1

Did you check if your "poiTag" excists/spelled correct? could you provide example of the data

if (pois[n].poiTag == "home") {
  homeIcons.push(L.marker(homeMarker));
 } else {
  circles.push(L.circleMarker([pois[n].lat, pois[n].lng], markerOptions, {name: data[i].Name}));
}