简体   繁体   中英

Getting Undefined property from Object created with d3.js

I am trying to read in data from a csv file and console.log the data returned. I am getting undefined. Why is it that if I console.log the store object I can see a property of routes in the console? But trying to consoloe log the routes property shows undefined.

let store = {};

function loadData() {
    // Add the code to load the CSV file named "routes.csv" | 1 Line
    let promise = d3.csv("routes.csv");

    return promise.then(routes => {
        // Save the routes into our store variable;
        store.routes = routes;
        return store;
    })

}

loadData();
console.log(store.routes);

The first few lines of the csv file looks like the following:

ID,AirlineID,AirlineName,AirlineCountry,SourceAirportID,SourceAirportCode,SourceAirport,SourceCity,SourceCountry,SourceLatitude,SourceLongitude,DestAirportID,DestCode,DestAirport,DestCity,DestCountry,DestLatitude,DestLongitude
1,24,American Airlines,United States,4355,ABE,Lehigh Valley International Airport,Allentown,United States,40.65209961,-75.44080353,3876,CLT,Charlotte Douglas International Airport,Charlotte,United States,35.2140007,-80.94309998
2,24,American Airlines,United States,4355,ABE,Lehigh Valley International Airport,Allentown,United States,40.65209961,-75.44080353,3752,PHL,Philadelphia International Airport,Philadelphia,United States,39.87189865,-75.2410965
3,24,American Airlines,United States,3718,ABI,Abilene Regional Airport,Abilene,United States,32.41130066,-99.68190002,3670,DFW,Dallas Fort Worth International Airport,Dallas-Fort Worth,United States,32.896801,-97.03800201
4,24,American Airlines,United States,4019,ABQ,Albuquerque International Sunport Airport,Albuquerque,United States,35.04019928,-106.6090012,3670,DFW,Dallas Fort Worth International Airport,Dallas-Fort Worth,United States,32.896801,-97.03800201
5,24,American Airlines,United States,4019,ABQ,Albuquerque International Sunport Airport,Albuquerque,United States,35.04019928,-106.6090012,3484,LAX,Los Angeles International Airport,Los Angeles,United States,33.94250107,-118.4079971
6,24,American Airlines,United States,4019,ABQ,Albuquerque International Sunport Airport,Albuquerque,United States,35.04019928,-106.6090012,3830,ORD,Chicago O'Hare International Airport,Chicago,United States,41.97859955,-87.90480042
7,24,American Airlines,United States,4019,ABQ,Albuquerque International Sunport Airport,Albuquerque,United States,35.04019928,-106.6090012,3462,PHX,Phoenix Sky Harbor International Airport,Phoenix,United States,33.43429947,-112.012001
8,24,American Airlines,United States,532,ABZ,Aberdeen Dyce Airport,Aberdeen,United Kingdom,57.20190048,-2.197779894,507,LHR,London Heathrow Airport,London,United Kingdom,51.4706,-0.461941

Returning values inside the then block return a promise. So, you need to add a then block with your function call which is not needed here. I think that will just make it more complex.

You can simply log the data inside the function and write your code inside the then block only.

let store = {};

function loadData() {
    // Add the code to load the CSV file named "routes.csv" | 1 Line
    let promise = d3.csv("routes.csv");

promise.then(routes => {
    // Save the routes into our store variable;
    store.routes = routes;
    console.log(store.routes);
  })
}

loadData();

UPDATE

let store = {};

function loadData() {
    // Add the code to load the CSV file named "routes.csv" | 1 Line
    let promise = d3.csv("routes.csv");
    return promise;
}

loadData().then(routes => {
  // Save the routes into our store variable;
  store.routes = routes;
  console.log(store.routes);
})

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM