javascript - D3 加载数据

Question

我正在学习D3。我正在处理的示例之一的代码是在旧版本的 D3 下编写的。我知道在 5.7.0 下数据加载的工作方式有所不同，但是对于这个示例，我无法正确加载数据。当只是加载数据（1 个函数）时，我知道它是如何工作的，但是在这个有 2 个函数的示例中，我无法找到解决方案。

谁能给我一些建议，告诉我如何在最新版本的 d3 下重新工作？这是代码：

function show() {

'use strict';

// load the data
var loadedData;

d3.csv('./data/businessFiltered.csv').then(
    function(row) {
        switch (row.yearsInBusiness) {
            case "001" : row.yearsInBusinessLabel = "All"; break;
            case "311" : row.yearsInBusinessLabel = "less then 2 years"; break;
            case "318" : row.yearsInBusinessLabel = "2 to 3 years "; break;
            case "319" : row.yearsInBusinessLabel = "4 to 5 years"; break;
            case "321" : row.yearsInBusinessLabel = "6 to 10 years"; break;
            case "322" : row.yearsInBusinessLabel = "11 to 15 years"; break;
            case "323" : row.yearsInBusinessLabel = "more then 16 years"; break;
        }

        return row;
    },
    function (data) {
        loadedData = data;
        updateCircle();
    }); ...

标签： javascriptd3.js

Answer 1

查看d3.csv() 的文档，您似乎可以指定一个回调函数.get()：

function show() {

'use strict';

// load the data
var loadedData;

d3.csv('./data/businessFiltered.csv')
    .row(function(row) {
        switch (row.yearsInBusiness) {
            case "001" : row.yearsInBusinessLabel = "All"; break;
            case "311" : row.yearsInBusinessLabel = "less then 2 years"; break;
            case "318" : row.yearsInBusinessLabel = "2 to 3 years "; break;
            case "319" : row.yearsInBusinessLabel = "4 to 5 years"; break;
            case "321" : row.yearsInBusinessLabel = "6 to 10 years"; break;
            case "322" : row.yearsInBusinessLabel = "11 to 15 years"; break;
            case "323" : row.yearsInBusinessLabel = "more then 16 years"; break;
        }
        return row;
    })
    .get(function(error, data) {
        loadedData = data;
        updateCircle();
    });