D3无法加载自定义geojson数据

时间:2019-04-19 17:21:08

标签: javascript d3.js data-visualization

我正在尝试加载使用geojson.io创建的自定义geojson file,结果如下:

enter image description here

当我使用另一个geojson时,数据会完美加载,但是自定义数据似乎永远无法正常工作,因此我推断代码是干净的。我在滥用geojson.io网站吗? 这是代码:

<!DOCTYPE html>
<html>
    <head>
        <script src="./d3/d3.js"></script>
        <link rel="stylesheet" type="text/css" href="style.css" />
        <title>Squalalaa ! Nous sommes partis !</title>
    </head>
    <body>

        <script type="text/javascript">
        var h = 600, w = 500;
        var projection = d3.geoAlbersUsa().translate([w/2, h/2]).scale(600);
        //var projection = d3.geoMercator().scale(1000).translate([w/2, h+300]);

        var path = d3.geoPath(projection);
        var svg = d3.select("body").append("svg").attr("height", h).attr("width", w).style("stroke", "black");
        //svg.append("circle").attr("cx", 20).attr("cy", 20).attr("r", 10);

        d3.json("map.geojson").then (function(json){
            console.log(json);
            svg.selectAll("path").data(json.features).enter().append("path").attr("d", path).style("fill", "blue");
        });
        </script>        
    </body>
</html>

0 个答案:

没有答案