Cannot add Leaflet markers to map iterating through CSV

Question

I have data from a CSV that I want to turn into markers using the latest version of LeafletJS. I can successfully turn the CSV into an array of js objects and have confirmed that the latlng information is correct and being properly created. However, the markers do not place on the map.

// create map object
var mymap = L.map('mapid');

// fetch tiles from Mapbox API
L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
    attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
    maxZoom: 18,
    id: 'mapbox/streets-v11',
    tileSize: 512,
    zoomOffset: -1,
    accessToken: [removed for privacy]
}).addTo(mymap);

// set view on page load
$(document).ready(function() {
    // [40.47, -79.98]: LatLng for Allegheny County
    // 12: zoom parameter
    mymap.setView([40.47, -79.98], 12)

    $.get('../data/output.csv',function(data) {
        var results = $.csv.toObjects(data);
        console.log("printing")
        console.log(results);
        results.forEach(result => {
            var latlng = L.latLng(parseFloat(result.Latitude),parseFloat(result.Longitude));
            var marker1 = L.marker(latlng).addTo(mymap);
        });
     });
});

Does anyone know why the markers aren't being created?

Answer 1

The csv sample would be very helpful. IMO your problem is in passing latlong values.

Docs says that coordinates shout be passed in Array.

I'm not sure what L.latLng passes, try console.log it and if it's array, so I'm wrong and curious what's the problem.

You could also try put it some sandbox like eg.: https://jsfiddle.net/