Javascript 有没有办法在D3V5中修复和显示地图？

我正在D3V5中构建一个choropleth，在这里使用澳大利亚州的JSON文件：。 但是，当我尝试在浏览器中加载文件时，应该显示地图的区域完全为空：

下面是我用来制作图表的代码：

const second_width = 900;
const second_height = 750;

const projection = d3.geoMercator().center([132, -28]) // approximate geographical center of Australia
                   .translate([second_width/2, second_height/2])
                   .scale(2450);


const second_color = d3.scaleQuantize().range(['#edf8fb','#ccece6','#99d8c9','#66c2a4','#2ca25f','#006d2c']);
    
const path = d3.geoPath().projection(projection);


const second_svg = d3.select("#chart2")
            .append("svg")
            .attr("width", second_width)
            .attr("height", second_height);

d3.csv("data/Waste_Per_State_Per_Capita(1).csv" ,function(data) {

    //Set input domain for color scale
    second_color.domain([
        d3.min(data, function(d) { return d.Total; }), 
        d3.max(data, function(d) { return d.Total; })
    ]);

    d3.json("data/aust.json",function(json) {

        for (var i = 0; i < data.length; i++) {
    
            var data_state = data[i].States;
            
            //Grab data value, and convert from string to float
            var dataValue = parseFloat(data[i].Total);
    
       
            for (var j = 0; j < json.features.length; j++) {
            
                var json_state = json.features[j].properties.STATE_NAME;
                
    
                if (data_state == json_state) {
            
                    //Copy the data value into the JSON
                    json.features[j].properties.value = dataValue;
                    
                    //Stop looking through the JSON
                    break;
                    
                }
            }       
        }

        second_svg.selectAll("path")
            .data(json.features)
            .enter()
            .append("path")
            .attr("d", path)
            .style("fill", function(d) {
            //Get data value
                var value = d.properties.value;
                            
                if (value) {
                    //If value exists…
                    return second_color(value);
                } else {
                    //If value is undefined…
                    return "#ccc";
                }
            });


            second_svg.selectAll("text")
                .data(json.features)
                .enter()
                .append("text")
                .attr("fill", "darkslategray")
                .attr("transform", function(d) { return "translate(" + path.centroid(d) + ")"; })
                .attr("text-anchor", "middle")
                .attr("dy", ".35em")
                .text(function(d) {
                    return d.properties.STATE_NAME;
                });

            
            
   });
})

你能找出为什么我不能让地图显示在网站上（尽管在服务器上加载）？您的解决方案是如何在D3V5中加载这样的地图的

---

谢谢大家!

您的代码示例使用了一个不存在的文件

data/aust.json

，我建议您删除对

d3.csv

和

d3.json

的调用，只需在代码示例中放置准备好的数据对象，地图应该显示（比例可能已关闭，但您应该看到一些东西）。最有可能的原因是您使用的是d3v5或d3v6，其中包含用于d3.csv、d3.json的。或者，我们需要更多地查看您的代码。接下来，我意识到我之前没有明确说明：使用d3v4为我绘制地图，使用d3v4为您提供代码/数据。仔细阅读，我发现您使用的是d3v5，在这种情况下，您需要更改d3.json/d3.csv以反映上述更改的签名-否则您共享的代码将起作用。我现在意识到，在d3.csv和d3.json上，我必须添加。然后（函数（数据）），它现在在d3 v5中起作用。我要感谢你们两位的帮助！

States,Energy Recovery,Disposal,Recycling,Total
ACT,53,70,0,123
New South Wales,28,80,48,156
Northern Territory,34,203,0,237
Queensland,50,143,10,203
South Australia,36,75,7,118
Tasmania,47,138,0,185
Victoria,51,108,14,173
Western Australia,29,163,29,221