无法使用D3显示地图 - 无法读取属性

时间:2017-09-24 08:59:46

标签: javascript json d3.js

以欧洲为中心的世界地图代码(https://bl.ocks.org/MariellaCC/0055298b94fcf2c16940)中引用的json具有要素属性。当我在本地运行代码时,我收到错误:

  

“无法读取null的属性'功能'”。

我下载了"ne_50m_admin_0_countries_simplified.json"文件并检查它是否已损坏或遗失了该属性。我错过了什么?谢谢。

//Width and height
var w = 800;
var h = 600;

//Define map projection


var projection = d3.geo.mercator() //utiliser une projection standard pour aplatir les pôles, voir D3 projection plugin
                       .center([ 13, 52 ]) //comment centrer la carte, longitude, latitude
                       .translate([ w/2, h/2 ]) // centrer l'image obtenue dans le svg
                       .scale([ w/1.5 ]); // zoom, plus la valeur est petit plus le zoom est gros 

//Define path generator
var path = d3.geo.path()
                 .projection(projection);


//Create SVG
var svg = d3.select("#container")
            .append("svg")
            .attr("width", w)
            .attr("height", h);

//Load in GeoJSON data
d3.json("ne_50m_admin_0_countries_simplified.json", function(json) {

    //Bind data and create one path per GeoJSON feature
    svg.selectAll("path")
       .data(json.features)
       .enter()
       .append("path")
       .attr("d", path)
       .attr("stroke", "rgba(8, 81, 156, 0.2)")
       .attr("fill", "rgba(8, 81, 156, 0.6)");

});

0 个答案:

没有答案