简体   繁体   English

从使用 d3.js 创建的对象中获取未定义的属性

[英]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.我正在尝试从 csv 文件和 console.log 中读取数据返回的数据。 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?为什么如果我 console.log 存储对象我可以在控制台中看到路由的属性? But trying to consoloe log the routes property shows undefined.但是尝试控制台记录 routes 属性显示未定义。

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: csv 文件的前几行如下所示:

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.在 then 块中返回值会返回一个承诺。 So, you need to add a then block with your function call which is not needed here.因此,您需要在函数调用中添加一个 then 块,而此处不需要。 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.您可以简单地记录函数内的数据,并仅在then块内编写代码。

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);
})

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

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