D3.js D3.csv未返回数据获取承诺挂起

我没有从D3.js获得任何数据。如果我将一个变量包装成一个对象列表，并将其用于我的数据，那么下面的代码可以工作。但是，当我尝试使用d3.csv创建一个同名变量时，我没有在控制台中返回任何内容。我刚收到一个“承诺{}。请帮忙。谢谢

<script>
            var h = 350;
            var w = 500;

        var monthlySales;

        var loadData = () => { 
            return d3.csv("data/MonthlySales.csv")
                    .then( (d) => { monthlySales = d } ) };

        loadData();
        console.log(monthlySales);

            // var monthlySales = [
            //     {"month":10, "sales":100},
            //     {"month":20, "sales":130},
            //     {"month":30, "sales":250},
            //     {"month":40, "sales":300},
            //     {"month":50, "sales":265},
            //     {"month":60, "sales":225},
            //     {"month":70, "sales":180},
            //     {"month":80, "sales":120},
            //     {"month":90, "sales":145},
            //     {"month":100, "sales":130},
            // ];

            var lineFun = d3.line()
                .x((d) => d.month*3)
                .y((d) => h - d.sales)
                .curve(d3.curveLinear);

            var svg = d3.select("body").append("svg")
                .attr("width", w)
                .attr("height", h);

            var viz = svg.append("path")
                .attr("d", lineFun(monthlySales))
                .attr("stroke", "purple")
                .attr("stroke-width", 2)
                .attr("fill", "none");

            var labels = svg.selectAll("text")
                .data(monthlySales)
                .enter()
                .append("text")
                .text((d) => d.sales)
                .attr("x", (d) => d.month*3-25)
                .attr("y", (d) => h - d.sales)
                .style("font-size", "12px")
                .style("font-family", "sans-serif")
                .attr("fill", "#666666")
                .attr("text-anchor", "start")
                .attr("dy", ".35em")
                .attr("font-weight", function(d,i) { 
                    if (i === 0 || i ==(monthlySales.length-1) ) {
                        return "bold";
                    } else { return "normal"; }
                });
        </script>

var h=350；
var w=500；
月季变种；
var loadData=（）=>{
返回d3.csv（“data/MonthlySales.csv”）
.然后（（d）=>{monthlySales=d}）；
loadData（）；
控制台日志（每月）；
//月收益率=[
//{“月”：10，“销售”：100}，
//{“月”：20，“销售”：130}，
//{“月”：30，“销售”：250}，
//{“月”：40，“销售”：300}，
//{“月”：50，“销售”：265}，
//{“月”：60，“销售”：225}，
//{“月”：70，“销售”：180}，
//{“月”：80，“销售”：120}，
//{“月”：90，“销售”：145}，
//{“月”：100，“销售”：130}，
// ];
var lineFun=d3.line（）
.x（（d）=>d.month*3）
.y（（d）=>h-d.sales）
.曲线（d3.曲线线）；
var svg=d3.选择（“正文”）.追加（“svg”）
.attr（“宽度”，w）
.attr（“高度”，h）；
var viz=svg.append（“路径”）
.attr（“d”，lineFun（monthlySales））
.attr（“笔划”、“紫色”）
.attr（“笔划宽度”，2）
.attr（“填充”、“无”）；
var labels=svg.selectAll（“文本”）
.数据（每月销售）
.输入（）
.append（“文本”）
.text（（d）=>d.sales）
.attr（“x”，（d）=>d.月*3-25）
.attr（“y”，（d）=>h-d.sales）
.style（“字体大小”，“12px”）
.style（“字体系列”、“无衬线”）
.attr（“填充”，“#666666”）
.attr（“文本锚定”、“开始”）
.attr（“dy”，“.35em”）
.attr（“字体重量”，函数（d，i）{
如果（i==0 | | i==（monthlySales.length-1））{
返回“粗体”；
}else{返回“正常”；}
});

基于我对您上一个问题的回答，您可以通过两种方式进行：

这两种方法都要求您将

loadData（）；

之后的所有代码放入一个在承诺解析后执行的结构中

最简单的方法是将loadData函数更改为：

var loadData = () => { 
    return d3.csv("data/MonthlySales.csv")
            .then( (d) => { 
                monthlySales = d;
                /* Put all code after 'loadData();' here */
            } 
        )};

loadData();        
/* Take all remaining code from after here */

更好的方法是将代码放入单独的函数中：

var doViz = () => {
    /* Put all code after 'loadData();' here */
}

var loadData = () => { 
    return d3.csv("data/MonthlySales.csv")
            .then( (d) => { 
                monthlySales = d;
                doViz();
            } 
        )};

loadData();
/* Take all remaining code from after here */

---

上次你问我关于承诺的问题时，我发布的答案有什么问题？它需要比我现在更多的编码知识，我无法让它为我工作。我每天都在努力变得更好。我尝试了你提供的参考中的代码，我正在用这些代码更新上面的帖子。我仍然会出错。我想我需要一个更简单的方法ach，我不会搞砸的。谢谢你的反馈。Getting TypeError:无法读取未定义的属性“length”。我发布了一个新的答案，告诉你我能做什么。