Bagaimana untuk Memuatkan Data daripada Fail CSV dalam D3 v5 dengan Janji?

Memuatkan Data daripada Fail CSV dalam D3 v5

Dalam D3 v4, memuatkan data daripada fail CSV adalah mudah menggunakan XMLHttpRequest. Walau bagaimanapun, dengan pengenalan Promises dalam D3 v5, prosesnya telah berubah sedikit.

Menggunakan D3 v5

Untuk memuatkan data daripada fail CSV menggunakan D3 v5, anda boleh menggunakan fetch() API. Begini cara anda boleh mengubah suai kod anda:

d3.csv('data/dataset.csv')
    .then(function(data) {
        if (error !== null) {
            alert ("Couldn't load the dataset!");
        } else {
            //do something
        };
    })
    .catch(function(error) {
        //handle error
    })

Memahami Perbezaan

Perbezaan utama antara D3 v4 dan D3 v5 terletak pada cara mereka mengendalikan permintaan tak segerak. D3 v4 menggunakan XmlHttpRequest, yang tidak mengembalikan Janji. Akibatnya, anda memberikannya fungsi panggil balik yang berjalan setelah permintaan selesai.

Sebaliknya, D3 v5 menggunakan API Promise, yang membolehkan anda mengendalikan kes kejayaan dan kegagalan secara berasingan. Fungsi 'then()' digunakan untuk mengendalikan kes kejayaan, manakala 'catch()' adalah untuk mengendalikan ralat.

Contoh

Coretan kod berikut menyediakan contoh lengkap cara memuatkan data daripada fail CSV menggunakan D3 v5:

d3.csv('yourcsv.csv')
  .then(function(data) {
      // data is now whole data set
      // draw chart in here!
  })
  .catch(function(error){
     // handle error   
  })

Dengan memanfaatkan Promise API, D3 v5 menyediakan cara yang lebih berstruktur dan fleksibel untuk mengendalikan pemuatan data tak segerak berbanding D3 v4.

Atas ialah kandungan terperinci Bagaimana untuk Memuatkan Data daripada Fail CSV dalam D3 v5 dengan Janji?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!